一、CSS復合選擇器
1、標簽指定選擇器: h1.demo { color: red; }; h1#des { color: red; };
2、后代選擇器: .box li p{} ? ?box類下的所有li標簽下的p標簽;
3、并集選擇器:.class,h3{} 中間用逗號隔開
4、子代選擇器:?h1 > strong {color:red;}
解讀為:選擇器h1 > strong可以解釋為“選擇作為h1元素子元素的所有strong元素”。
建議:尖括號與選擇器之間有空格。
5、屬性選擇器:[ ]是標志
h1[id]{} 擁有id屬性的標簽;
h1[id][class]{} 擁有id和class屬性的標簽
input[type="text"]{}?
二、偽類選擇器
:link: 偽類將應用于未被訪問過的鏈接。IE6不兼容,解決此問題,直接使用a標簽
:visited:偽類將應用于已經被訪問過的鏈接
:hover:偽類將應用于有鼠標指針懸停于其上的元素。在IE6只能應用于a連接,IE7+所有元素都兼容
:active:偽類將應用于被激活的元素,如被點擊的鏈接、被按下的按鈕等
:focus:偽類將應用于擁有鍵盤輸入焦點的元素
三、CSS的層疊性和繼承性
層疊性:層疊性是指多種CSS樣式的疊加;
繼承性:子標記會繼承父標記的某些樣式。
注意:適當的利用繼承性可以簡化代碼.
所有字相關的都可以繼承,比如:color、text-系列、font-系列、line-系列、cursor
并不是所有的CSS屬性都可以繼承,例如,下面的屬性就不具有繼承性:邊框、外邊距、內邊距、背景、定位、元素寬高屬性。
所有盒子相關的屬性都不能繼承。
四、優先級
行內樣式的優先級最高,其次是內嵌樣式的,ID選擇器對應的樣式優先級最高。其次是Class樣式再次是標簽選擇器樣式,再次是通配符選擇器設置的樣式后面是 繼承的樣式,最后是瀏覽器默認的樣式。
!important被賦予最大的優先級.