你可以通過添加空白字符和注釋來提高樣式表的可讀性。你也可以把不同的選擇器放到一組中來，這樣同一樣式可以應用到這一組中。
空白字符是指空格、tab字符和換行。你可以通過添加這些空白字符來提高樣式表的可讀性。
對頁面而言，空白字符也是頁面的一個組成部分，它的效果就是創造了邊距、分割，還有行和列間的空白。
如果你的樣式表中一行只有一條規則，那這是使用空白字符最少的情況。但是，對于復雜的樣式表而言，這可能不便于閱讀，而且維護起來也比較困難。
樣式表的書寫風格可以根據你自己的喜好來選擇。但是，如果你開發的項目需要分享給他人，那就很有必要來制定一些書寫規范。
示例
有人喜歡我們這里使用的緊湊的書寫風格，但是如果規則較長的時候就需要來進行分割：
.carrot {color: orange; text-decoration: underline; font-style: italic;}也有人喜歡下面這種每行只寫一個屬性-值的風格：
.carrot{color: orange;text-decoration: underline;font-style: italic;}還有人喜歡縮進（兩個空格、四個空格，或者tab鍵是最常用的方式）：
.carrot { color: orange; text-decoration: underline; font-style: italic;}還有人喜歡這種垂直對齊的方式（這種方式比較難維護）：
.carrot { color : orange; text-decoration : underline; font-style : italic; }有些人混合使用空白字符來提高可讀性：
.vegetable { color: green; min-height: 5px; min-width: 5px }.vegetable.carrot { color: orange; height: 90px; width: 10px }.vegetable.spinach { color: darkgreen; height: 30px; width: 30px }而且，在使用的空白字符的時候，有人喜歡用tab鍵，有人喜歡使用空格。
CSS注釋以/* 開始，以 */結束。
你可以在樣式表中寫些實際意義的注釋，也可以是為了測試的目的而寫的臨時性的注釋內容。
對于樣式表中的注釋內容一定要寫在注釋標簽內，這樣瀏覽器在解析的時候會忽略注釋。一定要注意注釋的起始標簽。樣式表的其他部分始終要符合語法規則。
示例
/* style for initial letter C in first paragraph */.carrot { color: orange; text-decoration: underline; font-style: italic; }當很多元素具有相同的樣式時，你就需要定義一個選擇器組，組內用逗號分隔。這樣聲明的樣式就會應用到組內所有的選擇器上。
在樣式表的其他地方，你也可以單獨對這些選擇器重新設置樣式，這些樣式會應用到相應的選擇器上。
示例
這條規則將 ](https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/h1), [, 和 “ 匹配到的元素設置為相同顏色。
將定義顏色的規則寫在一個地方是正確的，因為有些時候，這個顏色值可能需要統一修改。
/* color for headings */h1, h2, h3 {color: navy;}編輯你的樣式表，將下面的幾條規則添加進去（規則順序可以任意設置）：
strong {color: red;}.carrot {color: orange;}.spinach {color: green;}#first {font-style: italic;}p {color: blue;}為了讓代碼變得可讀性更高，你需要通過分析其中的聯系來對代碼重新排序，并選擇你認為最合適的方式來添加一些空白字符和注釋。
保存文件并刷新瀏覽器頁面，要確保你更改后代碼不影響原來的顯示效果：
| **C**ascading **S**tyle **S**heets |
|---|
| **C**ascading **S**tyle **S**heets |
?
新聞熱點
疑難解答
