CSS2
CSS2是層疊樣式表，它是一種排版技術，能讓元素按特定的樣式顯示，如字體大小，顏色、布局等。在網頁中有三種使用方法：

用<style>標記聲明，如
<style>div {font-size: 12pt;}div {color: blue;}</style>
在元素中用style屬性指定，如：
<div style="font-size: 12pt;color: blue">CSS測試</div>
用LINK標記鏈接一個外部CSS文件，如：
<link rel="stylesheet" type="text/css" href="mycss.css">
按作用域來分，有三類的樣式表，分別是網頁解釋器樣式表、作者樣式表和瀏覽者樣式表。網頁解釋器樣式表也叫默認的樣式表，當沒有另外的樣式表加載時使用。作者樣式表就是網頁設計師設計的樣式表。瀏覽者樣式表是瀏覽網頁的用戶在瀏覽器上另外設置的樣式表。
CSS的基本數據類型

integer，表示整數，可取正負值。如：12，-24。
number，表示數字，可取正負值和小數。如：12.1，-14.3。
lenght，表示距離長度，可取正負值和小數，后跟一個單位，如:12em，12cm。單位又分相對單位和絕對單位，相對單位有：em，ex，px。絕對單位有：in(英寸)，cm(公分)，mm(公厘)，pt(等于1/72英寸)，pc(等于12pt)。
percentage，表示百分比值，可取正負和小數。如：20%，-40%。
uri，表示網絡資源。如：http://www.ringkee.com。
inherit參數值
<style>body {width: 600px;}.div1 {width: 120%;}.div2 {width: inherit;}說明：div1的寬度是600px*120%div2的寬度繼承父元素body的參數，是600px
選擇符的作用是指定哪些元素使用哪些樣式。選擇符可以分為簡單選擇符和復合選擇符兩類，簡單選擇符是類型選擇符、通用選擇符加上零個或多個屬性選擇符、ID選擇符、偽類等組成。復合選擇符是用">"和" "號結合多個簡單選擇符組成。">"和" "號兩邊要加上空格。
本文由武林網（http://www.companysz.com）整理發布！轉載請注明出處，謝謝！
下面介紹各種選擇符：

通用選擇符，用"*"號表示，可用于所有標記。如：
<style>* {font-size: 14pt;}*.EM {color: red;}</style><div>應用字體樣式</div><em class="EM">應用紅色樣式</em>
類型選擇符，與標記名一樣，只作用已該標記上。如：
<style>div {font-size: 14pt;}</style><div>應用樣式</div>
子代選擇符，HTML標記是可嵌套的，子代選擇符可把樣式表應用于子嵌套的子標記上，如：
<style>div p b {font-size: 14pt;}</style><div><p>沒有應用樣式</p><p><b>應用樣式</b></p></div>
子選擇符，與子代選擇符類似，但它只調用第一層子元素。如：
<style>div > b {color: red;}div p > em {color: green;}</style><div><b>當b標記是div標記的子標記時應用紅色樣式</b></div><div><p><em>當em是p的子標記且p是div的子標記時應用綠色樣式</em></p></div>
鄰近選擇符，當兩個元素位于同一層且在位置是前后關系時，可以使用鄰近選擇符。兩個選擇符用" "號分開，如果A位于B之前，則B可應用樣式。如：
<style>div p {color: red;}</style><div>沒有應用樣式</div><p>應用紅色樣式。</p>
屬性選擇符，HTML標記有屬性，我們可為特定的屬性指定樣式。有四種寫法，分別是：

[屬性]，樣式只應用于指定的屬性。
[屬性=值]，樣式只應用于指定的屬性與值都相同的情況
[屬性~=值]，樣式只應用于指定的屬性且屬性值包含指定值的情況，屬性值是用空格分隔的字符串。
[屬性|=值]，樣式只應用于指定的屬性且屬性值是的第一個字符串是指定值的情況，屬性值是用"-"分隔的字符串。
<style>[href] {color: red;}A[href="http://www.ringkee.com"] {color: green;}table[summary~="table"] {color: black;}table[summary|="this-is-a-table"] {color: blue;}</style><a href="http://www.python.org">應用紅色樣式</a><a href="http://www.ringkee.com">應用綠色樣式</a><table summary~="This is a table> <tr> <td>應用黑色樣式</td> </tr></table><table summary|="This-is-a-table> <tr> <td>應用藍色樣式</td> </tr></table>
類選擇符，與屬性選擇符類似，但它只指對class屬性應用樣式。類選擇符用"."語法，如.value與[class~=value]是一樣的。
<style>.myid {color: red;}</style><div class="myid">應用紅色樣式</div>
ID選擇符，與屬性選擇符類似，但它只指對ID屬性，用"#"語法。
<style>#myid {color: red;}</style><div id="myid">應用紅色樣式</div>
:first-child偽類，當標記是另一個標記的第一個子標記時，應用樣式。
<style>p:first-child {color: red;}</style><p>p是body的第一個子標記，應用紅色樣式</p><div>測試</div><p>p標記是body的第三個子標記，不應用紅色樣式</p>
:link和:visited偽類只作用于a標記，在指定href屬性的前提下，:link表示a標記還沒被點擊時的樣式，:visited表示被當點后的樣式。
<style>a:link {color: blue;}a:visited {color: red;}</style><a href="http://www.ringkee.com">鏈接沒點擊前是藍色的，點擊后是紅色的</a>
:hover，:active和:fouce偽類也只能作用于a標記，且也要指定href屬性。:hover指定當用戶把鼠標移到a標記上并且指針變成手型時應用的樣式。:active指定點擊a鏈接并放開鼠標時所顯示的樣式。:fouce指定用戶點擊a標記瞬間，即鏈接成為焦點時所顯示的樣式。:hover要放在:link和:visited之后，否則:hover的樣式會覆蓋:link和:visited的樣式。
<style>a:link {color: blue;}a:visited {color: red;}a:haover {color: green;}a:focus {color: black;}a:active {color: white;}</style> <a href="http://www.ringkee.com">應用樣式</a>
:left及:right偽類只作用于頁面內容。當頁面在左邊時應用:left指定的樣式，當頁面在右邊時應用:right指定的樣式。
:first-line只對div和p標記不效，樣式只應用于這兩個標記內的第一行內容。
<style>:first-line {color: red;}</style><div width:50px;>該元素內的第一行內容應用紅色樣式。</div>
:first-letter偽類也只能作用于div和p標記，與:first-line不同的是它只作用于標記內的第一個字符。如果我們想要每一行的開頭字符大一點就可使用該偽類。
<style>:first-letter {font-size: 40pt;}</style><p>這行文字開頭第一個字符的大小是40pt</p>
:before和:after偽類可在內容的前面或后面增加特定的內容或指定樣式。
<style>p:before {content: "("; color: red;}p:after {content: ")"; color: green;}</style><p>這行文字前后會增加一對括號，前括號為紅色</p><p>這行文字前后會增加一對括號，后括號為綠色</p>
層疊選擇符是指當有多個選擇符的樣式都應用于同一個標記時的選擇規則。該規則利用一個三位數來確定，數字最大的就可選中。這三位數的確定規則的這樣的，如果選擇符中有ID選擇符，則百位數加1,否則為0。如果有屬性選擇符、類選擇符或偽類選擇符，則十位數加1，否則為0。如果有類型選擇符，則個位數加1，否則為0。如果選擇符是#div div，這三位數則是101。讓我們分析一下，#div是ID選擇符，所以在百位數上加1，div是類型選擇符，所以個位數上加1變成101。"*"表示0，優先級最低。
樣式表的主要功能是指定同一個文件在不同媒體上按不同的樣式顯示。通過在種方式可指定不同媒體

@media方式
<style>@media screen {div{color:red;}}@media print {div{color:green;}}</style><div>不同媒體顯示不同顏色</div>
@import是另一種指定不同媒體的方式，它可引入外部的css文檔。它的語法格式是：
<style>@import url("simple.css") screen;</style>
在HTML4.0中，可以用LINK標記的media屬性為不同媒體類型指定樣式表。
<LINK rel="stylesheet" href="import.css" type="text/css" media="print">
!important規則會改變應用樣式的優先級，有!important參數樣式的優先級最高，會優先顯示。
<style>h1 {color:red;}h1 {color:green !important;}</style><h1>字體為綠色</h1>