1.樣式複用，友善網站的後期維護；
2.實作頁面的精确控制，實作精美複雜頁面；
3布局定位；
4外觀美化；
1 【三種使用CSS的方式】
1、行内樣式表：直接在HTML開始标簽中使用style=""的方式引用；
特點：将CSS代碼與HTML代碼完全糅雜在一起，不符合W3C關于内容與表現分離的要求。不利于樣式複用；
優先級：最高。
2、内部樣式表： 在<head></head>中，使用<style type="text/css"></style>方式引用；
特點：将CSS代碼與HTML代碼分離，但是沒有徹底分離CSS檔案與HTML檔案，不利于多頁面複用樣式。
3、外部樣式表：使用link标簽連結CSS檔案。
<link rel="stylesheet" type="text/css" href="css/01css.css" />
特點：實作了CSS與HTML的徹底分離，有利于樣式複用及後期維護。
【通用選擇器】
1、寫法： *{}
2、作用： 選中頁面中的所有HTML标簽
3、優先級：最低！
【标簽選擇器】
1、寫法： HTML标簽名{ }
2、作用： 選中所有對應的HTML标簽，并修改其樣。
【類選擇器 class選擇器】
1、寫法： .選擇器名{}
2、調用： 在需要修改樣式的HTML标簽上，使用class="選擇器名"
3、優先級： 當作用于同一層時，class選擇器>标簽選擇器
.list{
color: blue;
}
【ID選擇器】
1、寫法： #選擇器名{}
2、調用： 在需要修改樣式的HTML标簽上，使用id="選擇器名"
3、優先級：同一層時，id選擇器>class選擇器
4、ID選擇器是唯一的！同一頁面嚴禁出現同名ID！！！
#first{
color: green;
}
【後代選擇器】
1、寫法： 選擇器1 選擇器2 …… 選擇器N {}
2、生效規則： 選擇器2必須是選擇器1的【後代】……以此類推
【子代選擇器】
1、寫法： 選擇器1>選擇器2>……>選擇器N{}
2、生效規則： 選擇器2必須是選擇器1的【直接子代】……
div>ul>li{
}
【交集選擇器】
1、寫法： 選擇器1選擇器2……選擇N{}
2、生效規則： 必須同時滿足所有選擇器，才會生效
li.list#first{
}
【 并集選擇器】
1、寫法： 選擇器1,選擇器2,……,選擇N{}
2、生效規則： 滿足任意一個選擇器，均可生效
.list,#first{
color: darkslategray;
}
【選擇器命名規範】
1、隻能有字母、數字、下劃線組成；
2、開頭不能是數字。
【選擇器優先級】
1、就近原則：近者優先。
2、當作用于同一層時：可有權重計算
權重劃分： 标簽選擇器 1'
本文轉自xsster51CTO部落格，原文連結：http://blog.51cto.com/12945177/1950811 ，如需轉載請自行聯系原作者
![移動端touch事件和滑鼠事件[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)