css选择器、权重
基礎選擇器
一、標簽選擇器
p{。。。}? h1{…..}?? css不區分大小寫，建議小寫
1、所有的標簽都可以作為標簽選擇器去使用
2、無論這個標簽藏多深，一定能夠被選上
3、選擇頁面所有的，而不是具體某一個；
標簽選擇器，選擇的是頁面上所有這種類型的標簽，所以經常描述“共性”，無法描述某一個元素的“個性”的。?
?
二、id選擇器
所有的標簽都可以有id屬性來標識標簽。
Id屬性的值：
1）只能是數字字母下劃線，必須以字母開頭 ，不能和標簽同名。
2）一個頁面中不能出現相同的id，哪怕他們不是一個類型。
具有唯一性
?
id的優先級大于class
三、類選擇器
.就是類的符號。類的英語叫做class，任何標簽都可以有class屬性
1）class屬性是可以重復的，2）同一個標簽可以同時屬于多個類選擇器，切記，一個標簽內不能出現兩個同名屬性
1、在開發時，盡量不要去試圖用一個類名，把某個標簽的所有樣式寫完。這個標簽要多攜帶幾個類，共同造成這個標簽的樣式。
2、 每一個類要盡可能小，有“公共”的概念，能夠讓更多的標簽使用。
?
到底用id還是用class？
答案：盡可能的用class，除非極特殊的情況可以用id。
原因：id是js用的。也就是說，js要通過id屬性得到標簽，所以我們css層面盡量不用id，要不然js就很別扭。另一層面，我們會認為一個有id的元素，有動態效果。
?
Css高級選擇器
一、后代選擇器
空格就表示后代，如：div1 p{}選中div1的后代所有的p。
強調一下，選擇的是后代不一定是兒子。
后代選擇器就是一種平衡：共性、特性的平衡，共性中的特性。當要設置某一部分整體樣式時，可以使用后代選擇器。
后代選擇器描述的是祖先結構
?
二、交集選擇器
h3.special{
??? color:red;
}
選擇的元素是同時滿足兩個條件：必須是h3標簽，然后是special。
一般標簽放在前面。交集選擇器沒有空格。
三、并集選擇器（分組選擇器）
用逗號表示并集。
例：h3,li{
???? color:red;
}
四、通配符*
*就表示所有元素。效率不高，盡量要少用
?
五、兒子選擇器
IE7開始兼容，IE6不兼容
>號
六、序選擇器
IE8開始兼容；IE6，7不兼容
序選擇器指first-child和last-child
ul li:first-child{
??????? color:red;
??????? }
ul li:last-child{
???????????? color:blue; ? }
七、下一個兄弟選擇器
IE7開始兼容，IE6不兼容
+表示選擇下一個兄弟
h3+p{
????? color:red;
??? }
選擇上的是h3元素后面緊挨著的第一個兄弟。
?
選擇器可以組合使用。
?
?
繼承性
當給自己設置樣式時，自己的后代都繼承上了，這個就是繼承性
哪些屬性能繼承？
color、 text-開頭的、line-開頭的、font-開頭的。
這些關于文字樣式的，都能夠繼承；所有關于盒子的、定位的、布局的屬性都不能繼承。
繼承性是從自己開始，直到最小的元素。
層疊性
層疊性就是css處理沖突的能力。所有的權重計算，沒有任何兼容問題！
?
當選擇器，選擇上了某個元素的時候，那么要這么統計權重：
id的數量，類的數量，標簽的數量
百位???????????? 十位??????????????????? 個位
不進位，實際上能進位（255個標簽等于一個類名）但沒有實際意義！
當權重相同時，誰在后以誰為準。
如果不能直接選中某個元素，通過繼承的，權重值為0，
如果權重值都為0時，也就是繼承來的，那么就按就近原則，誰描述的近，聽誰的。???????????? 并集選擇器權重要拆開計算，
?
權重問題大總結：
1） 先看有沒有選中，如果選中了，那么以（id數，類數，標簽數）來計權重。誰大聽誰的。如果都一樣，聽后寫的為準。
2） 如果沒有選中，那么權重是0。如果大家都是0，就近原則。
?
權重問題深入
一、一個標記可以攜帶多個類名，標簽樣式并不是和類名順序有關，而是和css樣式書寫順序有關、
二、！important標記
1）！important是給標記屬性添加權重，（無窮大）
font-size:60px !important;
注意：增加的屬性的權重值，而不是選擇器、
2）無法提升繼承的權重
3）!important不影響就近原則
如果大家都是繼承來的，按理說應該按照“就近原則”，那么important能否影響就近原則呢？
答案是：不影響。遠的，永遠是遠的。不能給遠的寫一個important，干掉近的。
?
三、權重問題總結
轉載于:https://www.cnblogs.com/ljxblog/p/5689541.html
與50位技術專家面對面20年技術見證，附贈技術全景圖總結
- 上一篇： centos 最简单的服务程序
- 下一篇： 【C语言重点难点精讲】C语言预处理