1、善用css縮寫可以減少頁面文件大小,提高下載速度,同時使代碼簡潔可讀。 如:
div{ border-top:1px solid #cccccc; border-left:1px solid #cccccc; border-right:1px soli #cccccc; border-bottom:1px solid #cccccc; }
可以寫為
p{border:1px solid #cccccc}
再如:
div{ margin-top:10px; margin-right:20px; margin-bottom:30px; margin-left:40px; }
可以改寫為:
/*注意上、右、下、左的書寫順序*/ div{margin:10px 20px 30px 40px} /*注意,數值與單位不能有空格,每個值之間用空格隔開*/
(詳細請參考:css2參考手冊、常用css縮寫總結)
2、可以同時為一個html元素的class屬性設定多個規則(多重class定義)。 通常我們寫法為:<p class=”a”></p> 實際上我們可以為p元素指定多個規則,如:
CSS: .a{…} .b{….} HTML: <p class="a b">該元素同時包括a和b中設定的樣式</p>
注意:多個規則之間用空格分開。
3、明確定義單位,除非值為0 忘記定義尺寸是css初學者新手普遍存在的問題。在html我們可以寫width=”100”,但在css中應該給出一個準確的單位。如:width:100px;height:50px;font-size:9pt ,0值除外,因為不論對于任何單位。0值的大小都是相等的。
注意:不要在數值和單位之間加空格。
[1] [2] [3] 下一頁 |