一、常用的選擇器
元素選擇器
作用：通過元素選擇器可以選則頁面中的所有指定元素
語法：標籤名
作用：通過元素的id屬性值選中唯一的乙個元素
語法：#id屬性值
作用：通過元素的class屬性值選中一組元素
語法：.class屬性值
作用：通過選擇器分組可以同時選中多個選擇器對應的元素
語法：選擇器1,選擇器2,選擇器n
作用：可以選中同時滿足多個選擇器的元素
語法：選擇器1選擇器2選擇器n
作用：他可以用來選中頁面中的所有的元素
語法：*
元素之間的關係
父元素：直接包含子元素的元素
子元素：直接被父元素包含的元素
祖先元素：直接或間接包含後代元素的元素，父元素也是祖先元素
後代元素：直接或間接被祖先元素包含的元素，子元素也是後代元素
兄弟元素：擁有相同父元素的元素叫做兄弟元素
作用：選中指定元素的指定後代元素
語法：祖先元素 後代元素
作用：選中指定父元素的指定子元素
語法：父元素 > 子元素
概述
偽類專門用來表示元素的一種的特殊的狀態。
當我們需要為處在這些特殊狀態的元素設定樣式時，就可以使用偽類。
:link
:visited
:hover
作用：表示滑鼠移入的狀態
：active
:focus
作用：表示文字框獲取焦點
ps::hover和:
active也可以為其他元素設定
(ie6不支援)
概述
使用偽元素來表示元素中的一些特殊的位置p:first-letter
作用：選擇p中第乙個字元
p:first-line
作用：選擇p中的第一行
:before
作用：表示元素最前邊的部分， 一般before都需要結合content這個樣式一起使用，通過content可以向before或after的位置新增一些內容
:after
表示元素的最後邊的部分
概述
可以根據元素中的屬性或屬性值來選取指定元素[屬性名] 選取含有指定屬性的元素
[屬性名=
"屬性值"
] 選取含有指定屬性值的元素
[屬性名^=
"屬性值"
] 選取屬性值以指定內容開頭的元素
[屬性名$=
"屬性值"
] 選取屬性值以指定內容結尾的元素
[屬性名*=
"屬性值"
] 選取屬性值以包含指定內容的元素
子元素選擇器舉例
:first-child 可以選中第乙個子元素
:last-child 可以選中最後乙個子元素
:nth-
child
(***
) 可以選中任意位置的子元素,該選擇器後邊可以指定乙個引數，指定要選中第幾個子元素,even 表示偶數字置的子元素,odd 表示奇數字置的子元素。
:first-
of-type、:last-
of-type、:nth-
of-type
和:first-child這些非常的類似，只不過child，是在所有的子元素中排列，而type，是在當前型別的子元素中排列
前乙個元素 + 後乙個元素
作用：可以選中乙個元素後緊挨著的指定的兄弟元素
前乙個元素 ~ 後邊所有元素
作用：選中後邊的所有兄弟元素
作用：可以從已選中的元素中剔除出某些元素概述當使用不同的選擇器，選中同乙個元素時並且設定相同的樣式時，這時樣式之間產生了衝突，最終到底採用哪個選擇器定義的樣式，由選擇器的優先順序（權重）決定，優先順序高的優先顯示。
規則
內聯樣式 ， 優先順序 1000
id選擇器， 優先順序 100
類和偽類， 優先順序 10
元素選擇器，優先順序 1
通配* ， 優先順序 0
繼承的樣式，沒有優先順序
當選擇器中包含多種選擇器時，需要將多種選擇器的優先順序相加然後在比較，但是注意，選擇器優先順序計算不會超過他的最大的數量級，如果選擇器的優先順序一樣，則使用靠後的樣式。
並集選擇器的優先順序是單獨計算 div , p , #p1 , .hello。
可以在樣式的最後，新增乙個!important，則此時該樣式將會獲得乙個最高的優先順序，將會優先於所有的樣式顯示甚至超過內聯樣式，但是在開發中盡量避免使用!important。
CSS選擇器大全
選擇器 例子例子描述 css.class intro 選擇 class intro 的所有元素。1 id firstname 選擇 id firstname 的所有元素。1 選擇所有元素。2element p選擇所有元素。1element,element div,p 選擇所有元素和所有元素。1ele...
CSS 選擇器大全
一 概念 css中的選擇器有很多種，常用的分別是標籤選擇器 根據元素標籤名稱 類選擇器 根據元素class屬性 id選擇器 根據元素id屬性 並且三種選擇器可以相互結合使用 二 更多 三 選擇器表 四 詳解 設定p元素行高1.5em,距離外填充1em 後代選擇器，該選擇器定位元素e的後代中所有元素f...
css選擇器大全
選擇器是css的核心，從最初的元素 class id選擇器，演進到偽元素 偽類，以及css3中提供的更豐富的選擇器，定位頁面上的任意元素開始變得愈發的簡單。p ul li ul li 僅限ul的直接子元素li，如果li裡面還巢狀著另乙個 ul 結構時，最裡面的 li 將被忽略 li li 定位具有相...