CSS1 中定義的選擇器
類型選擇器
用于選擇指定類型的元素(其實(shí)他就是 html 標(biāo)簽選擇器),常見用法如下:
| body { /*對(duì) body 元素定義樣式*/}body,div { /*同時(shí)選擇多種標(biāo)簽元素*/} | 
ID 選擇器
用于選擇指定 ID 的 html 元素,常見使用方法如下:
| <div id="nav"> </div><style> #nav { /*定義 ID 為 nav 的元素的樣式*/ }</style> | 
因?yàn)?CSS 的渲染順序是從右往左進(jìn)行渲染的,而 ID 則是全唯一的,那么就可以省略掉前面的類型選擇器。
類選擇器
用于選擇指定類名的 html 元素,常見使用方法如下:
| <div class="nav"> </div><style> .nav { /*定義 class 為 nav 的元素的樣式*/ }</style> | 
包含選擇器
用于選擇層級(jí)嵌套的元素,常見使用方法如下:
| <div class="nav"> <div class="nav-tools"> </div></div><div class="nav"> <div> <div class="nav-tools"> </div> </div></div><style> .nav .nav-tools { /*定義元素的父級(jí)元素 class 包含 nav,且子元素class 包含 nav-tools 的元素*/ }</style> | 
需要注意的是:包含選擇器不關(guān)心層級(jí),只要后面的選擇器是被包含在前一個(gè)元素中的即可。如上述例子,兩個(gè) nav-tools 都會(huì)被選擇器選中!
偽類選擇器
:link——鏈接偽類選擇器
用于定義鏈接未被訪問狀態(tài)時(shí)的樣式,常見使用方法如下:
| <div class="nav"> <div class="nav-tools"> <ul> <li><a href="#"></a></li> </ul> </div></div><style> a:link { text-decoration: none; color: blue; }</style> | 
:visited——鏈接偽類選擇器
用于定義已被訪問的鏈接樣式,常見使用方法如下:
| <style> a:visited { text-decoration: none; color: red; }</style> | 
:active——用戶操作偽類選擇器
用于定義被激活的元素樣式,常見使用方法如下:
| <style> a:active { text-decoration: none; color: green; }</style> | 
:hover——用戶操作偽類選擇器
用于定義鼠標(biāo)經(jīng)過元素是的樣式,常見使用方法如下:
| <style> a:hover { text-decoration: none; background-color: #F4F4F4; }</style> |