首頁  >  文章  >  web前端  >  巧妙地使用CSS選擇器_經驗交流

巧妙地使用CSS選擇器_經驗交流

WBOY
WBOY原創
2016-05-16 12:05:401368瀏覽

可以透過不同規則來定義不同內容區塊裡的連結樣式。類似這樣:#nav a:link或 #main a:link或#footer a:link。也可以定義不同內容區塊中相同元素的樣式不一樣。例如,透過#main p和#sider p分別定義#main p和#sider p的樣式。從結構上講,你的頁面是由圖片、連結、清單、段落等組成的,這些元素本身並不會對顯示在什麼網路 設備中(PDA還是手機或網路電視)有影響,它們可以被定義為任何的表現外觀。 

  一個仔細結構化的HTML頁非常簡單,每一個元素都被用於結構目的。當你想要縮排一個段落,不需要使用blockquote標籤,只要使用p標籤,並對p 加上一個CSS的text-indent規則就可以實現縮排目的。 p是結構化標籤,text-indent是表現屬性,前者屬於HTML,後者屬於CSS。 (這就是傳說中的結構與表現相分離) 

  良好結構的HTML頁面內幾乎沒有表現屬性的標籤。程式碼非常乾淨簡潔。例如,原先的程式碼

,現在可以只在HTML中寫
,所有控製表現的東西都寫到CSS中去,在結構化的HTML中, table就是表格,而不是其他什麼(更不能被用來佈局和定位)。 

  當然,CSS選擇器不只是這麼簡單,除了id還有class還有後代選擇器,屬性選擇器等等。
陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn