本文的講解將幫助你了解網站和CSS文件，還將幫助你們了解CSS文件中的內容。索引部分知識一個格式化了的CSS注釋段落，CSS的標準和最佳示例。

 

CSS是用來定義網站的用戶界面或將顯示和內容區(qū)分開來的。

由于CSS被廣泛地使用在幾乎所有網站上，所以讓我們花些時間來創(chuàng)建樣式表并確保它符合良好的標準。下面的技巧會極大地在開發(fā)過程中幫助CSS初學者。

索引

本處的定義將幫助你和其他開發(fā)者了解網站和CSS文件，還將幫助你們了解CSS文件中的內容。索引部分知識一個格式化了的CSS注釋段落。

1給出CSS文件的作者信息

2定義網站的設計（列數(shù)，靜態(tài)/動態(tài)）［columns， static/liquid］

3持續(xù)跟蹤文件版本（當文件有多個作者或未來需要有升級更新的時候非常有用）

 

錨點

錨點就好像在同一個CSS文件中的書簽一樣，錨點使你清晰地瀏覽整個CSS文件按并且使它很有組織。

錨點需要在CSS的索引（上面提到的）處定義，因為CSS沒有自己的錨點系統(tǒng)，所以我在文檔中使用了一個簡單的技巧定義錨點。

方法是用一個比較罕見的字符來定義注釋，當你想找某個錨點時，你就可以從索引處復制并查找錨點的定義符，并找到該錨點。

 

重定義

重定義是用來覆蓋HTML默認的標簽樣式，把它們進行重定義的方法。你是否見過這樣的CSS代碼，它只是想把那個特定的元素加上樣式！

CSS中一個非常美麗的用法是上下文選擇器，讓我們使用它：

 

 

命名規(guī)則

一個很關鍵的因素將元素給出精確無誤并且干凈有效的名字，這將避免混亂并讓你更容易快捷地讀懂你的CSS。

 

速寫

CSS中的速寫功能是你可以將許多同類型的屬性合并成一個的屬性。

CSS速寫使開發(fā)過程更簡單并且讓你的CSS文件干凈、簡短、可讀，下面是幾個例子：

 

Sprites

（譯者注：翻譯成精靈好像并不能對文章加深感性認識，反倒在真正看到英文的時候不理解了，所以干脆不譯。）

將所有的背景圖片合并到一張并且使用背景定位來顯示不同的部分，這就是我們所說的CSS Sprites。

CSS Sprites能夠減少HTTP請求的數(shù)量，節(jié)省帶寬，使得讀取更快。同時也可以避免圖像不穩(wěn)定現(xiàn)象（比如當鼠標經過一張圖片時可以顯示另一張圖片的效果，后一張圖片將在慢速的因特網連接中等待半天才會出現(xiàn)）。

CSS Sprites最佳并且最受歡迎的例子是蘋果公司網站上的菜單系統(tǒng)：