《Head First HTML and CSS》
1.瀏覽器忽略tabs returns and most spaces.
2.<!-- comments -->
3.<html> start of html
<head>start the page head
<title>Head First Lounge</title> 頁面標題
</head>
<body>頁面的body
<h1>Welcome to the Head First Lounge</h1>一級標題
<img src="drinks.gif">放置圖片
<p>開始一個段落 <h2>Directions</h2>二級標題
<em>Dance Dance Revolution</em> Puts emphasis on Dance Dance Revolution
4.An element is composed of three parts: an opening tag, content, and a closing tag. There are a few elements, like <img>, that are an exception to this rule.
5.CSS is an abbreviation for Cascading Style Sheets.
6.You can add CSS to an HTML web page by putting the CSS rules inside the <style> element.The <style> element should always be inside the <head> element.
7.<a href="elixir.html">elixirs</a> a元素。hypertext reference = href Use the <a> element to create a hypertext link to another web page.The content of the <a> element becomes clickable in the web page.The href attribute tells the browser the destination of the link.
8.attributes.需要加引號
<style type="text/css">The type attribute specifies which style language we’re using, in this case CSS
<a href="irule.html">The href attribute tells us the destination of a hyperlink
<img src="sweetphoto.gif">The src attribute specifies the filename of the picture an img tag displays.
9.相對路徑 ../ ./ 在網頁中使用“/” 而不使用“\”
10.<q></q> 表示引用 但是IE不顯示 inline goes with the flow <q>, <a>, and <em> are inline elements
11.That’s where the <blockquote> element comes in. Unlike the <q> element, which is meant for short quotes that are part of an existing paragraph,the <blockquote> element is meant for longer quotes that need to be displayed on their own.
<h1>, <h2>, ... , <h6>, <p>, and <blockquote> are all block elements.
Block elements are always displayed as if they have a linebreak before and after them,while inline elements appear “in line” within the flow of the text in your page.
12.linebreak <br> short for <br></br>
void elements:doesn’t have any content <br><img>
normal elements, like <p>, <h1>, and <a> can not short for <a> when they do not have content
empty elemrnt != void element
XHTML <br /> = HTML <br>
13.unordered list = ul ordered list = ol list item = li
<ol>.
<li></li>
</ol>
should always use <ol> and <li> together (or <ul> and<li>).<ol> and <ul> elements are designed to work only with the <li> element.
nested list
14.<time>This element tells the browser that the content is a date or time, or both.
<pre>Use this element for formatted text when you want the browser to show your text exactly as you typed it.
<code>The code element is used for displaying code from a computer program.
<strong>Use this element to mark up text you want emphasized with extra strength
15. < < > >
16.<a href="http://wickedlysmart.com/buzz" title="Read all about caffeine on the Buzz">Caffeine Buzz</a>
The title is displayed as a tool tip in most browsers. Just pass your mouse over the link and hold it there a second to see the tool tip.
17.id attribute.One special property that elements with ids get is that you can link to them.
<h2 id="chai">Chai Tea, $1.85</h2>
<a href="index.html#chai">See Chai Tea</a>
18.To open a page in a new window, you need to tell the browser the name of the window in which to open it.
open a new window:<a target="_blank" href="http://wickedlysmart.com/buzz"title="Read all about caffeine on the Buzz">Caffeine Buzz</a>