基本信息
CSSCSS目前最新版本為CSS3，是能夠真正做到網頁表現與內容 分離的一種樣式設計語言。相對於傳統HTML的
級聯樣式表CSSid和class選擇器
如果你要在HTML元素中設定CSS樣式，你需要在元素中設定"id"和"class"選擇器。id選擇器
id選擇器可以為標有特定id的HTML元素指定特定的樣式。
HTML元素以id屬性來設定id選擇器,CSS中id選擇器以"#"來定義。
以下的樣式規則套用於元素屬性id="para1":
實例
1
2
3
4
5
#para1
{
text-align:center;
color:red;
}
ID屬性不要以數字開頭，數字開頭的ID在Mozilla/Firefox瀏覽器中不起作用。
class選擇器
class選擇器用於描述一組元素的樣式，class選擇器有別於id選擇器，class可以在多個元素中使用 。
class選擇器在HTML中以class屬性表示,在CSS中，類選擇器以一個點"."號顯示：
在以下的例子中，所有擁有center類的HTML元素均為居中。
實例
1
.center{text-align:center;}
你也可以指定特定的HTML元素使用class。
在以下實例中,所有的p元素使用class="center"讓該元素的文本居中:
實例
1
p.center{text-align:center;}
類名的第一個字元不能使用數字！它無法在Mozilla或Firefox中起作用。
創建編輯
創建和編輯css更加常用的是AdobeDreamweaver系列軟體，可視化編輯更利於web工程師快速的創建和編輯css，新版本CS5.0、CS5.5、CS6.0、CC，包含AdobeBrowserLab，用於針對多種瀏覽器測試css的兼容性。AdobeDreamweaver是一個css創建和編輯必不可少的利器！FrontPage2000包含有能用來為站點創建外部樣式表的模板。可以用空白模板或已包含樣式的模板來創建（例如Arcs）。當保存樣式表時，FrontPage會以.css作為檔案擴展名。要編輯樣式表，請雙擊資料夾列表中的樣式表。
當創建或修改網頁樣式時，可使用位於“格式”選單的“樣式”命令，FrontPage會自動創建嵌入的樣式表（如果原先不存在），並在嵌入的樣式表內將此樣式保存為類選擇器。
可以使用“樣式”對話框來創建新類選擇器，修改或刪除現有類選擇器，或將CSS格式設定屬性套用到標準HTML標記符上例如<H1>。當單擊“確定”關閉對話框時，FrontPage會將格式設定特徵寫回到使用正確語法的外部或嵌入的樣式表中。或者，可以用正確CSS語法鍵入樣式信息。要鍵入嵌入的樣式表的樣式信息，請單擊網頁視圖模式下的“HTML”選項卡。
如果對套用到站點的主題選擇 “套用CSS”複選框，FrontPage將在站點的根目錄下創建名為Theme1.css的檔案，其中Theme是主題的名稱。如果修改主題，FrontPage自動將更改寫回主題CSS里。也可以通過直接編輯主題CSS來修改主題。
高級語法
選擇器的分組你可以對選擇器進行分組，這樣，被分組的選擇器就可以分享相同的聲明。用逗號將需要分組的選擇器分開。在下面的例子中，我們對所有的標題元素進行了分組。所有的標題元素都是綠色的。
1
h1,h2,h3,h4,h5,h6{color:green;}
繼承及其問題
根據CSS，子元素從父元素繼承屬性。但是它並不總是按此方式工作。看看下面這條規則：
1
body{font-family:Verdana,sans-serif;}
根據上面這條規則，站點的body元素將使用Verdana字型（假如訪問者的系統中存在該字型的話）。
通過CSS繼承，子元素將繼承最高級元素（在本例中是body）所擁有的屬性（這些子元素諸如p,td,ul,ol,ul,li,dl,dt,和dd）。不需要另外的規則，所有body的子元素都應該顯示Verdana字型，子元素的子元素也一樣。並且在大部分的現代瀏覽器中，也確實是這樣的。
但是在那個瀏覽器大戰的血腥年代裡，這種情況就未必會發生，那時候對標準的支持並不是企業的優先選擇。比方說，Netscape4就不支持繼承，它不僅忽略繼承，而且也忽略套用於body元素的規則。IE/Windows直到IE6還存在相關的問題，在表格內的字型樣式會被忽略。我們又該如何是好呢？
關於繼承，還有一個特別的地方，如果<html>上沒有設定background相關屬性，而<body>上有設定，則<body>會向上傳播到<html>上；
並不是所有屬性都能繼承，比如CSS盒子模型相關屬性就是不能繼承的。
繼承是一個詛咒嗎？
如果你不希望"Verdana,sans-serif"字型被所有的子元素繼承，又該怎么做呢？比方說，你希望段落的字型是Times。沒問題。創建一個針對p的特殊規則，這樣它就會擺脫父元素的規則：
1
2
3
body{font-family:Verdana,sans-serif;}
td,ul,ol,ul,li,dl,dt,dd{font-family:Verdana,sans-serif;}
p{font-family:Times,"TimesNewRoman",serif;}
關於繼承其實是一個很好、很強大的功能，因為有繼承，我們可以少寫很多code.
">
