本節將要介紹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.類選擇器
<html>
<head>
<styletype="text/css">
.waring{Blue;}< /span>
.highlight{font-size:xx-large;cursor:help;}
</style>
</head>
<body>
<div>
<h1>我是h1</h1>
<h2>我是h2</h2>
<h3 class="highlight">我是h3</h3>
</div>
</body>
</html>
在瀏覽器中查看發現，只有在class屬性被定義的標籤被相應美化了，其他標籤仍爲默認樣式，類選擇器的名稱是自定義的。
3.ID選擇器
<html>
<head>
<styletype="text/css">
#myTxt
{
font-size:36px;
background-color:#00ff00;
}
</style>
</head>
<body>
<div>
<p>我是p</p>
<input id="myTxt" type="text"value="我是text"/>
</div>
</body>
</html>
ID選擇器和我們平時開發取對象很相似，最具有針對性。
對於以上的三種選擇器，三種選擇器可以結合使用，但是瀏覽器會給他們排個優先級，就是標籤的樣式被定義多次，該顯示哪個樣式，瀏覽器會其中優先級最高的樣式，樣式優先級：ID>class>標籤。
4.關聯選擇器
<html>
<head>
<styletype="text/css">
div h1{background:#00ff00}
</style>
</head>
<body>
<div>
<p>我是p</p>
<h1>我是h1</h1>
</div>
<h1>我也是h1</h1>
</body>
</html>
在瀏覽器中查看，我們發現，只有div標籤內的h1標籤被修飾了，div標籤內的其他標籤，甚至div外的h1標籤都沒有被修飾，這就是關聯組合器的作用，神奇吧。
5.組合選擇器
<html>
<head>
<styletype="text/css">
div,h1,p{background:#00ff00}
</style>
</head>
<body>
<div>我是div</div>
<h1>我也是h1</h1>
<p>我是p</p>
<h2>我是h2</h2>
</body>
</html>
在瀏覽器中查看，我們會發現，只有div,h1,p這三種標籤被修飾了，其他標籤沒有被修飾，這也是標籤選擇器的組合用法，達到頁面效果統一。
6.僞元素選擇器
<html>
<head>
<styletype="text/css">
a:active{color:Green};
a:hover{cursor:help};
a:link{color:Red};
a:visited{color:Blue};
</style>
</head>
<body>
<ahref="www.baidu.com">百度網首頁</a>
</body>
</html>
這是我介紹的最後一個選擇器了，上面代碼在瀏覽器中查看，發現超鏈接默認的顏色變爲了綠色，鼠標放上去的時候鼠標指針形狀爲問號幫助樣式，當我們鼠標按下時超鏈接的顏色變爲紅色，訪問完再回到頁面，發現超鏈接的顏色變爲藍色，我說完這些你也大概知道上面的代碼是什麼意思了，爲選擇器不僅可以用於a標籤，還可以用於p等標籤，具體怎麼用就去查幫助文檔吧，怎麼查呢？
DHTML->HTML元素->a標籤->樣式。
好了，關於選擇器我就介紹到這裏，之所以舉這麼簡單的例子，是因爲我主要講的是原理，不想因爲初學者突然看到其他難點而忽略了重點。好了，本節就到這裏，下一節將繼續HTML與CSS的結合方式。