css裡面有哪些選擇器

css中選擇器有：1、簡單選擇器；2、屬性選擇器；3、組合選擇器；4、偽類選擇器；5、偽元素選擇器；6、多重選擇器。

本文操作環境：windows7系統、CSS3版、Dell G3電腦。

CSS選擇器常見的有哪幾種?

一、簡單選擇器 Simple Selectors

選擇器	含義
*	通用元素選擇器，匹配任何元素
E	標籤選擇器，匹配所有使用E標籤的元素
.info	class選擇器，匹配所有class屬性中包含info的元素
#footer	id選擇器，匹配所有id屬性等於footer的元素

二、屬性選擇器 Attribute Selectors

選擇器	含義
[atrr]	選擇包含 attr 屬性的所有元素，不論 attr 的值為何
[attr=val]	[attr=val] 僅選擇 attr 屬性被賦值為 val 的所有元素

三、組合選擇器 Combinators

選擇器	含義
A, B	選中匹配 A 或/和 B 的元素
A B	選中匹配 B 且為匹配 A 的元素的後代元素(A B之間空格分開)
A > B	選中匹配 B 且為匹配 A 的元素的直接子元素
A + B	選中匹配 B 且為匹配 A 的元素的下一相鄰元素
A ~ B	選中匹配 B 且為匹配 A 的元素的下 N 個相鄰元素

四、偽類 Pseudo-classes

選擇器	含義
a:link	匹配所有未被點選的連結
a:visited	匹配所有已被點選的連結
a:hover	匹配滑鼠懸停其上的a元素
a:active	匹配滑鼠已經其上按下、還沒有釋放的a元素
li:first-child	匹配父元素的第一個子元素li
li:last-child	匹配父元素的最後一個子元素li
li:nth-child(n)	匹配父元素的第n個子元素li（odd奇數，even偶數）

五、偽元素 Pseudo-elements

選擇器	含義
E::before	在E元素內建立一個子元素，插入生成的內容作為偽元素，放在最前面
E::after	在E元素內建立一個子元素，插入生成的內容作為偽元素，放在最後面
E::selection	應用於檔案中被使用者高亮的部分（比如使用滑鼠選中的部分）
E::first-letter	匹配E元素的第一個字母第一行的第一個字母
E::first-line	匹配E元素的第一行

六、多重選擇器 Multiple Selectors

在HTML中，我們有時會對同一個標籤賦予多個class名稱，如：
<p class="one two"></p>
而在CSS裡面則可能同時選擇多個class，像是：
.one .two{}    /*兩個 class 中有空格*/
.one.two{}     /*兩個 class 中沒有空格*/
.one, .two{}   /*兩個 class 中出現逗號*/
這三者 one.two{ }，.one .two{ }，或者是.one, .two{ }有何區別？
第一個的 one 和 two 中間包含空格，意思是指，我必須要是在 one 裡面的 two，才會被選擇到。
第二個的 one 和 two 中間沒有包含空格，表示某個區塊必須同時具有 one 和 two 的 class 時，才能被 CSS 所選擇到到。
第三個的 one 和 two 中間包含逗號，意思是指 class 中有 one 或 two，都會被編輯器所選擇到。
簡單來說，沒空格表示必須同時包含才會被選取；有空格表示後面的 class 被鑲嵌在前面的 class 中才會被選取；逗號則表示只要有其中一個 class 就會被選取到。
【推薦學習：《》】

以上就是css裡面有哪些選擇器的詳細內容，更多請關注TW511.COM其它相關文章！