本節将要介紹CSS的選擇器，CSS有三種常用的選擇器，還有三種擴充選擇器，說到選擇器，那麼選擇器是做什麼用的呢？
上一節我們介紹CSS常用屬性的時候，我們都是通過在标簽内定義Style屬性來介紹的，但是如果Style中的屬性有很多，并且我們還要把相同類型的标簽用同一個CSS樣式來美化，我們總不能Copy代碼吧，首先頁面太亂，再者代碼量大，在大型的網站開發中會影響執行效率，最後自己操作起來也很麻煩，遇到這個問題，我們改怎麼解決呢？
這就是選擇器要做的事情，我們可以先定義好一個樣式，然後再指定給那些需要美化的标簽，這樣難道不好嗎？好，從美學角度講，一個頁面的同類事物隻有一個風格會給使用者整體舒服感，那麼選擇器該怎麼用呢？下面先請看下圖：
此圖看和想5分鐘，好好體會一下。了解了分類和用途之後，下面我們就結合代碼，看看你的體會對嗎？
1.标簽選擇器
<html>
<head>
<styletype="text/css">
div{background:#FF0000}
</style>
</head>
<body>
<div >我是div</div>
<div >我也是div</div>
<p>我是p</p>
<p>我也是p</p>
<inputtype="text" value="我是TXT"/>
</body>
</html>
在浏覽器中檢視發現所有的div标簽全被美化了，其他标簽都是預設狀态，<style type="text/css"></style>這段代碼可以先不用管，下一節會介紹，主要看紅色标記的部分，标簽選擇要寫在head标簽内，寫法格式要好好掌握。
2.類選擇器
.waring{Blue;}< /span>
.highlight{font-size:xx-large;cursor:help;}
<div>
<h1>我是h1</h1>
<h2>我是h2</h2>
<h3 class="highlight">我是h3</h3>
</div>
在浏覽器中檢視發現，隻有在class屬性被定義的标簽被相應美化了，其他标簽仍為預設樣式，類選擇器的名稱是自定義的。
3.ID選擇器
#myTxt
{
font-size:36px;
background-color:#00ff00;
}
<input id="myTxt" type="text"value="我是text"/>
ID選擇器和我們平時開發取對象很相似，最具有針對性。
對于以上的三種選擇器，三種選擇器可以結合使用，但是浏覽器會給他們排個優先級，就是标簽的樣式被定義多次，該顯示哪個樣式，浏覽器會其中優先級最高的樣式，樣式優先級：ID>class>标簽。
4.關聯選擇器
div h1{background:#00ff00}
<h1>我也是h1</h1>
在浏覽器中檢視，我們發現，隻有div标簽内的h1标簽被修飾了，div标簽内的其他标簽，甚至div外的h1标簽都沒有被修飾，這就是關聯組合器的作用，神奇吧。
5.組合選擇器
div,h1,p{background:#00ff00}
<div>我是div</div>
在浏覽器中檢視，我們會發現，隻有div,h1,p這三種标簽被修飾了，其他标簽沒有被修飾，這也是标簽選擇器的組合用法，達到頁面效果統一。
6.僞元素選擇器
a:active{color:Green};
a:hover{cursor:help};
a:link{color:Red};
a:visited{color:Blue};
<ahref="www.baidu.com">百度網首頁</a>
這是我介紹的最後一個選擇器了，上面代碼在浏覽器中檢視，發現超連結預設的顔色變為了綠色，滑鼠放上去的時候滑鼠指針形狀為問号幫助樣式，當我們滑鼠按下時超連結的顔色變為紅色，通路完再回到頁面，發現超連結的顔色變為藍色，我說完這些你也大概知道上面的代碼是什麼意思了，為選擇器不僅可以用于a标簽，還可以用于p等标簽，具體怎麼用就去查幫助文檔吧，怎麼查呢？
DHTML->HTML元素->a标簽->樣式。
![CSS的僞元素和僞類的差別[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)