使用樣式表有以下優點：

1.內容與表現分離

寫一個網頁就好比建房子，房子的結構通過磚塊、鋼筋、水泥搭建，后期通過瓷磚、地板等的裝飾，才能讓房子更加漂亮。

網頁通過HTML搭建整體結構，通過CSS修飾美化網頁。為了使得在搭建的過程中不受到美化網頁的影響，而是專注在結構上。并且在后期的維護上也更加方便。

2.網頁的表現統一，容易修改

分開之后，結構和樣式在不同的文件，互不影響，結構清晰，可讀性強，后期如果修改維護便于定位查找。

3.豐富的樣式，使得頁面布局更加靈活

首先樣式表中提供了強大的而且非常全面靈活的選擇器，可以供我們選取到網頁中的任何一個元素

從大的方面選擇器可以分為四大類：

1.基本選擇器

2.層次選擇器

3.結構偽類選擇器

4.屬性選擇器

如下圖我只是截取了屬性選擇器中幾種：

其次樣式表不僅提供了文本效果、背景和邊框還有2D/3D 轉換、動畫、多列布局、用戶界面等。

4.減少網頁的代碼量，增加網頁的瀏覽速度，節省網絡帶寬

很多CSS3技術通過提供相同的視覺效果而成為圖片的“替代品”

換句話說，在進行Web開發時，減少多余的標簽嵌套以及圖片的使用數量，意味著用戶要下載的內容將會更少，頁面加載也會更快。

另外，更少的圖片、腳本和Flash文件能夠減少用戶訪問Web站點時的HTTP請求數，這是提升頁面加載速度的最佳方法之一。

而使用CSS3制作圖形化網站無需任何圖片，極大地減少了HTTP的請求數量，并且提升了頁面的加載速度

基于以上幾點，使用樣式表是必須的！！

1、打開hbuilder，在空白的html文件上面設置一個div，給div一個class并命名為img。

2、在CSS里設置img的類一定的寬和高，引入示例圖片，設置圖片為不重復。并且給img的類設置“:hover”偽類，設置偽類內的透明度為0.6。

3、打開瀏覽器，在瀏覽器內查看效果。

4、將鼠標移入圖片，就會發現圖片已經變亮了。

以上就是用CSS設置鼠標經過圖片變亮，移開變變暗效果的演示。

a：hover表示當鼠標選定在a標簽上時a標簽的樣式變化。 這是css中偽類的使用格式。 偽類（Pseudo classes）是選擇符的螺栓，用來指定一個或者與其相關的選擇符的狀態。

它們的形式是selector:pseudo class { property: value; }，簡單地用一個半角英文冒號（:）來隔開選擇符和偽類。CSS很多的建議并沒有得到瀏覽器的支持，但有四個可以安全用在超鏈接上的偽類： :link用在未訪問的連接上。 :visited用在已經訪問過的連接上。 :active用于獲得焦點（比如，被點擊）的連接上。 :hover 用于鼠標光標置于其上的連接。

css修改超鏈接顏色的方法：

1.通過“a:link”修改超鏈接顏色；

2.通過“a:visited”改顏色；

3.通過“a:hover”設置變顏色；

4.通過“a:active”修改顏色。

在css中，可以使用“:link”偽類選擇器來設置鏈接顏色，只需要給a元素設置“a:link{顏色:顏色值;}”即可。“:link”選擇器用于選取未訪問的鏈接，然后給該鏈接添加所需樣式。