DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> CSS入門知識 >> CSS詳解 >> 七大CSS選擇符用法秘笈(2)
七大CSS選擇符用法秘笈(2)
編輯:CSS詳解     
五、class選擇符

其實id是對於XHTML標簽的擴展,而class是對SHtml多個標簽的一種組合,class直譯的意思是類或類別。
對於XHtml標簽使用class=""進行名稱指派。與id不同,class可以重復使用,對於多個樣式相同的元素,可以直接定義為一個class。
使用class的優點已不言自明,它對CSS代碼重用性有良好的體現,眾多的標簽均可以使用一個樣式來定義而不需要每一個編寫一個樣式代碼。
XHtml如下:

  1. <pclasspclass="he">p>
  2. <spanclassspanclass="he">span>
  3. <h5classh5class="he">h5>

CSS如下:

  1. .he
  2. {
  3. margin:10px;
  4. background-color:red;
  5. }

六、標簽指定式的選擇符

如果想同時使用id和class,也想同時使用標簽選擇符,可以使用如下的方式:

h1#content{}
/*表示所有id為content的h1標簽*/
h1.p1{}
/*表示所有class為p1的h1標簽*/

標簽指定式選擇符的精度介於標簽選擇符及id/class選擇符之間,是常用的選擇符之一。

七、組合選擇符

對於上面的所有選擇符而言,進行組合使用。如下:

h1.p1{}
/*表示h1下的所有class為p1的標簽*/
#contenth1{}
表示id為content的標簽下的所有h1標簽
h1.p1,#contenth1{}
/*表示h1下的所有class為p1的標簽以及id為content的標簽下的所有h1標簽*/
h1#contenth2{}
/*id為content的h1標簽下的h2標簽*/

CSS選擇符是非常自由與靈活的,可以根據頁面的需要,使用各種選擇符,盡量結構化與優化CSS文件.

文章出處:站點基地[http://www.zDBase.com/content/detail.ASPx?OID=5A821ED4-5EED-43E7-93E0-475C785A1C07]

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved