重用:
經(jīng)常會用到一些基本的式樣疊加,比如字體的顏色和加粗。網(wǎng)頁中可能同時出現(xiàn)三種情況:1.字體為紅色? 2.字體加粗 3.字體紅色加粗
這時我們只需要定義前兩個css:
.red{color:red;}
.b{font-weight:bold;}
第三種情況時用<div class="red b"></div>
子選擇器:
相對來說,簡化html文件的代碼更加重要,因此在css中使用子選擇器非常有益,同時也使css代碼更加容易理解。比如下面的代碼:
<div id="sub_nav">
<ul>
<li> <a href="#">Item 1</a></li>>
<li> <a href="#">Item 2</a></li>
<li> <a href="#">Item 3</a></li>
</ul>
</div>
如果div li a都有各自的式樣,采用子選擇器,可以省略代碼中l(wèi)i 和a 的class屬性,從而簡化代碼:
#sub_nav { /* Some styling */ }
#sub_nav li { /* Some styling */ }
#sub_nav a { /* Some styling */ }
組選擇器:
當一些元素類型、class或者id都有共同的一些屬性,你就可以使用組選擇器來避免多次的重復定義。這可以節(jié)省不少字節(jié)。
例如:定義所有標題的字體、顏色和margin,你可以這樣寫:
h1,h2,h3,h4,h5,h6 {
font-family:"Lucida Grande",Lucida,Arial,Helvetica,sans-serif;
color:#333;
margin:1em 0;
}
如果在使用時,有個別元素需要定義獨立樣式,你可以再加上新的定義,可以覆蓋老的定義,例如:
h1 { font-size:2em; }
h2 { font-size:1.6em; }
重用、子選擇器和組選擇器的靈活使用可以非常有效的減少代碼,同時非常有利的增加代碼的可讀性,具體的應用需要在具體編寫過程中體會。
posted on 2006-06-30 10:30
jackstudio 閱讀(355)
評論(0) 編輯 收藏 所屬分類:
common