css的選擇器,在前端開發中只是很小的一部分,但其重要性卻不可忽略。因為其比較繁瑣。在看了很多書籍和文章後。我發現選擇器的組織真的很混亂,沒有找到乙個完整的總結。不敢保證我的是否是最完整的,但我已竭盡所能。話不多說,直接看下文:
1.萬用字元選擇器:* /*鏈結未訪問*/
a:visited{} /*鏈結已訪問*/
a:hover{} /*滑鼠移動到鏈結*/
a:active{} /*選定鏈結*/
a:focus{} /*聚焦時*/
a:lang{} /*元素帶有指定lang時*/
a:first-child{} /*元素在頁面第一次出現時*/
5.偽元素選擇器:a:before{} /* 在某個元素的前面插入內容*/
a:after{} /*在某個元素的後面插入內容*/
a:first-line /*為某個元素的文字首行設定特殊樣式,只能用於塊級元素*/
a:first-letter /*為某個元素的文字首字母或第乙個字設定樣式,只能用於塊級元素*/
6.復合選擇器(包含以下幾種):
6.1交集選擇器:h3.class名{} //第乙個必須是標籤選擇器,第二個必須是id或class選擇器
6.2並集選擇器:h1,h2,span{} //結果是同時選中各個基本選擇器所選擇的範圍。
6.3後代選擇器:p span{} //用空格分隔開,p標籤之間包含span標籤,外層標籤寫在前面,內層的標記寫在後面,發生巢狀時,內層標記就成了外層標記的後代。
6.4子選擇器:p>span{} //只對其直接後代有影響
各類優先順序權重比例如下:
//////構建頁面框架時,通常只給外層標記定義class或者id。
後代選擇器與子選擇的區別:
後代選擇包括在其標籤內部的所有標籤,可以是子標籤,孫子標籤,曾孫子標籤。。。。
子選擇器只對其直接後代有影響,即:只作用於子標籤。
樣式選擇器權重優先順序如下:
important > 內聯樣式 > id > 類 | 偽類 | 屬性選擇 > 標籤 | 偽元素 > 繼承 > 萬用字元選擇器優先順序 CSS選擇器優先順序總結
css選擇器優先順序這個問題,相信有點經驗前端都會認為非常簡單,但是我們今天還是來總結一下吧。相信大家應該很少直接在html頁面寫樣式吧,一般都是用link標籤匯入css樣式表。使用者自定義樣式表就是我們用link標籤引入的css樣式表,為了保持不同瀏覽器下樣式相同,所以我們的自定義樣式表一般都會覆...
CSS選擇器及選擇器優先順序總結
1 元素選擇器 選擇器是元素,例如 p 2 類 class 選擇器 class屬性名,可有重複,乙個元素可有多個class值,用空格隔開。3 id選擇器 id屬性名,不能有重複名字 4 復合選擇器 交集選擇器 可選中同時滿足多個選擇器的元素,例 div.p3 p3 是類名,交集選擇器的兩個選擇器之間...
CSS 選擇器優先順序
css優先順序包含四個級別 文內選擇器,id選擇器,class選擇器,元素選擇器 以及各級別出現的次數。根據這四個級別出現的次數計算得到css的優先順序。css優先順序的計算規則如下 頁面中直接設定style,加1,0,0,0 每個id選擇器 如 id 加0,1,0,0 每個class選擇器 如 c...