1.關於樣式
1.1使用樣式的優點
假設有一個FAQ的頁面，需要將所有的question都設置爲綠色，可以在每個問題前加上<font>標籤將color屬性設置爲綠色。但是如果我們需要將頁面中所有問題改爲藍色，就會變得非常麻煩。所以需要樣式，樣式類似於C++中的宏定義，只需在開頭聲明，當需要改動時，只改變定義的值就都改了。
示例：
<style>p.question{color:green}</style>
該代碼建立了一個特定的<p>標籤累，其名稱爲question。每當使用<p>標籤，且其class屬性設置爲question時，段落文本都將用綠色顯示。
2樣式的基本要素
示例：
<head>
<title>style</title>
<style>h1{font-weight:bold;font-size:14pt;color:orange}</style>
</head>
在該示例中，樣式是爲<h1>標籤創建的，它設置了標題的字體高度、字號及顏色。Web頁的樣式必須被包括在頁面標題中。當然，頁面也可以直接應用於一段html代碼。
示例：
<h1 style = "font-weight:bold;font-size:14pt;color:orange">.....</h1>
第一種方式是創建作爲樣式頁的一部分，並且將要應用於所有<h1>標籤的樣式；而第二種方式創建的是隻應用於<h1>標籤指定實例的樣式。
3.樣式的應用
3.1內部樣式
在Web頁面的標題中創建一個或一組樣式並用<style>括住時，表示將該樣式應用於整個頁面。這種包含在Web頁中的樣式集合被稱爲“內部樣式頁”。
示例：
<head>
<title>FAQ</title>
<style>
h3{background:green;color:white}
p.question{color:green;font-style:italic}
</style>
</head>
3.2外部樣式
外部樣式頁被包含在一個獨立於將要應用該樣式的Web頁文件中。使用外部樣式頁的優點是，可以將樣式應用於多個Web頁。
示例：
h3{background:green}
p.question{color:green;font-weight:bold}
該代碼必須以一個帶有.css（這是用於級聯樣式的標準擴展名）擴展名的文件形式出現。假設該代碼被放在一個名爲"st.css"的文件中，然後使用下面代碼來應用該樣式：
<link rel = "stylesheet" type = "text/css" href = "st.css">
<link>標籤用來引用.css樣式頁並將該樣式頁與Web頁關聯起來。rel屬性只是說鏈接引用的是一個將要應用於文檔的樣式頁。type屬性指定的是鏈接內容的類型，在該示例中爲級聯樣式頁。同內部樣式頁，外部樣式頁的引用必須放在標題中。
3.3樣式類
除了將樣式應用於頁面中指定標籤的所有實例之外，還可以建立應用於一類標籤的“樣式類”。
示例：
p.question{color:green;font-style:italic}
該代碼表明，樣式類是通過將樣式指定爲標籤名後跟一個句點（.），然後跟類名稱（question）的形式來創建的。
3.4局部樣式
將樣式應用於個別標籤，這就是所謂的“局部樣式”。
示例：
<h3 style = "background:green;color:white">Rel</h3>
該樣式只應用於該標籤，局部樣式將覆蓋應用於同一個標籤的樣式頁中的所有樣式。
3.5鏈接樣式
鏈接樣式專門應用於Web頁中的超鏈接文本方式。下面是一些超鏈接狀態：
link 還沒有被訪問過的鏈接
visited 已經被訪問過的鏈接
active 剛剛被單擊的鏈接
hover 鼠標指針停留在鏈接上
通過在標籤a後跟一個冒號，然後跟超鏈接的狀態名可以爲超鏈接創建樣式。
示例：
a:hover{background:green;color:white}
4.樣式和自定義樣式標籤
HTML標籤有兩種：塊級標籤和內置標籤。塊級標籤通常會在Web頁中開始新的一行，並且常常會包含其他標籤。常用的有<p>、<body>、<table>、<h1>等等。內置標籤通常不會再Web頁中開始新的一行，並且只能包含文本或其他內置標籤。常用的有<b>、<i>、<font>和<img>等。
<div>標籤被用來創建自定義的塊級標籤；<span>標籤被用來創建自定義的內置標籤。
4.1創建自定義的樣式標籤
div.question{color:green;font-style:italic}
該代碼爲自定義問題創建了一個樣式。該樣式是通過使用div標籤名後跟一個句點，然後跟自定義樣式標籤的名稱來指定的。然而這並不意味着您已經創建了一個名爲“<question>”的自定義樣式標籤；相反，創建了一個名爲“question"的div標籤的自定義類別。
span.qna{font-size:150%}
該代碼自定義內置標籤。創建了一個具有qna類名的自定義樣式標籤。
4.2使用自定義的樣式標籤
示例：
<div class = "question">
<span class = "qna">Q</span>:What is your name?</div>
<p>
<span class = "qna">A</span>:Tom</p>
在該示例中，自定義的question樣式類被用於<div>標籤，以標記問題段落。在解答段落使用仍是傳統的<p>標籤。
