CSS選擇器就是指定CSS要作用的標簽，那個標簽的名稱就是選擇器。意為：選擇哪個容器。
公司主營業(yè)務(wù)：做網(wǎng)站、網(wǎng)站設(shè)計、移動網(wǎng)站開發(fā)等業(yè)務(wù)。幫助企業(yè)客戶真正實現(xiàn)互聯(lián)網(wǎng)宣傳，提高企業(yè)的競爭能力。成都創(chuàng)新互聯(lián)是一支青春激揚、勤奮敬業(yè)、活力青春激揚、勤奮敬業(yè)、活力澎湃、和諧高效的團隊。公司秉承以“開放、自由、嚴謹、自律”為核心的企業(yè)文化，感謝他們對我們的高要求，感謝他們從不同領(lǐng)域給我們帶來的挑戰(zhàn)，讓我們激情的團隊有機會用頭腦與智慧不斷的給客戶帶來驚喜。成都創(chuàng)新互聯(lián)推出尤溪免費做網(wǎng)站回饋大家。
CSS選擇器分類：
標簽選擇器、類選擇器、ID選擇器、全局選擇器、群組選擇器、后代選擇器、偽類選擇器
1、html標簽選擇器：
定義：以html標簽作為選擇器
2、class類選擇器：
定義：為HTML標簽添加class屬性，通過類選擇器來為具有此class屬性的元素設(shè)置css樣式。
類選擇器也可以對不同類型元素的同一個名稱的類選擇器設(shè)置不同的樣式規(guī)則：
同一個元素可以設(shè)置多個類，之間用空格隔開：
3、ID選擇器
定義：為HTML標簽添加ID屬性，通過ID選擇器來為具有此ID的元素設(shè)置CSS規(guī)則
4、群組選擇器
定義：集體統(tǒng)一設(shè)置樣式
5、全局選擇器
定義：所有標簽設(shè)置樣式
HTML文檔結(jié)構(gòu)圖
6、后代選擇器
定義：使用后代選擇器設(shè)置，之間用空格隔開，后代選擇器可以多層。
7、偽類選擇器
鏈接的四種狀態(tài)：激活狀態(tài)，已訪問狀態(tài)，未訪問狀態(tài)，鼠標懸停狀態(tài)。
偽類
說明
:link
未訪問的鏈接
:visited
已訪問的鏈接
:hover
鼠標懸停狀態(tài)
:active
激活的鏈接
:hover 用于訪問的鼠標經(jīng)過某個元素時；
:active 用于一個元素被激活時（即按下鼠標之后放開鼠標之前的狀態(tài)）
偽類選擇器的屬性：link visited hover active
說明：
1)?a:hover 必須置于?a:link和a:visited之后，才有效
2) a:active 必須置于 a:hover之后才有效
3) 偽類名稱對大小寫不敏感
8、CSS其它選擇器
css繼承特性，從父元素那繼承部分css屬性
選擇器的優(yōu)先級
ID選擇優(yōu)先級最高（id選擇器定義具有唯一性）
class選擇器次之（class選擇器可以多個）
元素選擇器再次之
其它選擇器優(yōu)先級主要根據(jù)定義的先后順序，最后定義的優(yōu)先級高
!important 加重選擇器的優(yōu)先級，添加在樣式規(guī)則之后，中間用空格隔開。
CSS選擇器命名規(guī)則
1：采用英文字母，數(shù)字以及"-" 和 "_" 命名
2：以小寫字母開頭，不能以數(shù)字和"-"?和 "_" 開頭
3：使用有意義的命名規(guī)范
常用CSS命名
header
頁頭
main
主體
footer
頁尾
nav
導(dǎo)航
sidebar
側(cè)欄
container
容器
column
欄目
title
標簽
menu
菜單
submenu
子菜單
*列舉常用命名，大家根據(jù)自身項目及團隊的規(guī)則命名
耐心學(xué)習(xí)基礎(chǔ)知識，基礎(chǔ)是蓋房的根基，必須打結(jié)實。
如果您覺得有用，記得在下方點贊、關(guān)注、留言，我會定期奉 上更多的驚喜哦，您的打賞支持才是我繼續(xù)努力的動力，么么噠。
每日分享在學(xué)習(xí)過程中總結(jié)的學(xué)習(xí)經(jīng)驗，學(xué)習(xí)筆記，筆試題，HTML，CSS，JavaScript，jQuery教程，Vue教程，PHP教程，TinkPHP教程等，望大家能以學(xué)習(xí)為目的，每天閱讀一篇文章，了解身邊的技術(shù)。陪有夢想的人一起成長！
在
CSS
中，選擇器是一種模式，用于選擇需要添加樣式的元素。
"CSS"
列指示該屬性是在哪個
CSS
版本中定義的。（CSS1、CSS2
還是
CSS3。）
選擇器
例子
例子描述
CSS
.class
.intro
選擇
class="intro"
的所有元素。
1
#id
#firstname
選擇
id="firstname"
的所有元素。
1
*
*
選擇所有元素。
2
element
p
選擇所有
p
元素。
1
element,element
div,p
選擇所有
div
元素和所有
p
元素。
1
element element
div
p
選擇
div
元素內(nèi)部的所有
p
元素。
1
elementelement
divp
選擇父元素為
div
元素的所有
p
元素。
2
element+element
div+p
選擇緊接在
div
元素之后的所有
p
元素。
2
[attribute]
[target]
選擇帶有
target
屬性所有元素。
2
[attribute=value]
[target=_blank]
選擇
target="_blank"
的所有元素。
2
[attribute~=value]
[title~=flower]
選擇
title
屬性包含單詞
"flower"
的所有元素。
2
[attribute|=value]
[lang|=en]
選擇
lang
屬性值以
"en"
開頭的所有元素。
2
:link
a:link
選擇所有未被訪問的鏈接。
1
:visited
a:visited
選擇所有已被訪問的鏈接。
1
:active
a:active
選擇活動鏈接。
1
:hover
a:hover
選擇鼠標指針位于其上的鏈接。
1
:focus
input:focus
選擇獲得焦點的
input
元素。
2
:first-letter
p:first-letter
選擇每個
p
元素的首字母。
1
:first-line
p:first-line
選擇每個
p
元素的首行。
1
:first-child
p:first-child
選擇屬于父元素的第一個子元素的每個
p
元素。
2
:before
p:before
在每個
p
元素的內(nèi)容之前插入內(nèi)容。
2
:after
p:after
在每個
p
元素的內(nèi)容之后插入內(nèi)容。
2
:lang(language)
p:lang(it)
選擇帶有以
"it"
開頭的
lang
屬性值的每個
p
元素。
2
element1~element2
p~ul
選擇前面有
p
元素的每個
ul
元素。
3
[attribute^=value]
a[src^="https"]
選擇其
src
屬性值以
"https"
開頭的每個
a
元素。
3
[attribute$=value]
a[src$=".pdf"]
選擇其
src
屬性以
".pdf"
結(jié)尾的所有
a
元素。
3
[attribute*=value]
a[src*="abc"]
選擇其
src
屬性中包含
"abc"
子串的每個
a
元素。
3
:first-of-type
p:first-of-type
選擇屬于其父元素的首個
p
元素的每個
p
元素。
3
:last-of-type
p:last-of-type
選擇屬于其父元素的最后
p
元素的每個
p
元素。
3
:only-of-type
p:only-of-type
選擇屬于其父元素唯一的
p
元素的每個
p
元素。
3
:only-child
p:only-child
選擇屬于其父元素的唯一子元素的每個
p
元素。
3
:nth-child(n)
p:nth-child(2)
選擇屬于其父元素的第二個子元素的每個
p
元素。
3
:nth-last-child(n)
p:nth-last-child(2)
同上，從最后一個子元素開始計數(shù)。
3
:nth-of-type(n)
p:nth-of-type(2)
選擇屬于其父元素第二個
p
元素的每個
p
元素。
3
:nth-last-of-type(n)
p:nth-last-of-type(2)
同上，但是從最后一個子元素開始計數(shù)。
3
:last-child
p:last-child
選擇屬于其父元素最后一個子元素每個
p
元素。
3
:root
:root
選擇文檔的根元素。
3
:empty
p:empty
選擇沒有子元素的每個
p
元素（包括文本節(jié)點）。
3
:target
#news:target
選擇當(dāng)前活動的
#news
元素。
3
:enabled
input:enabled
選擇每個啟用的
input
元素。
3
:disabled
input:disabled
選擇每個禁用的
input
元素
3
:checked
input:checked
選擇每個被選中的
input
元素。
3
:not(selector)
:not(p)
選擇非
p
元素的每個元素。
3
::selection
::selection
選擇被用戶選取的元素部分。
css選擇器是指可以獲取元素（標簽）對象，可以用來定義樣式或設(shè)置樣式
CSS選擇器如下：
1. 標簽名選擇器 div { color：Red;} /即頁面中的各個標簽名的css樣式
2.類選擇器 .divClass {color:Red;} /即定義的每個標簽的class 中的css樣式
3.ID選擇器 #myDiv {color:Red;} /即頁面中的標簽的id
4.后代選擇器（類選擇器的后代選擇器） .divClass span { color:Red;} /即多個選擇器以逗號的格式分隔 命名找到準確的標簽
5.群組選擇器 div,span,img {color:Red} /即具有相同樣式的標簽分組顯示
選擇器的優(yōu)先級
1.最高優(yōu)先級是 (直接在標簽中的設(shè)置樣式，假設(shè)級別為1000)div style="color:Red;"/div
2.次優(yōu)先級是（ID選擇器 ,假設(shè)級別為100） #myDiv{color:Red;}
3.其次優(yōu)先級是（類選擇器，假設(shè)級別為10） .divClass{color:Red;}
4.最后優(yōu)先級是 （標簽選擇器，假設(shè)級別是 1） div{color:Red;}
5.那么后代選擇器的優(yōu)先級就可以計算了啊
比如 .divClass span { color:Red;} 優(yōu)先級別就是：10+1=11
想詳細的話可以參考W3C文檔。
選擇器其實不難理解，就好比人名。打個簡單的比方，路人甲的名字叫馬花藤，外號小馬哥。相對于css，“馬花藤”，“路人甲”，“小馬哥”
都可以成為這個人的選擇器了。所以簡單來看，選擇器就是
html
標簽的某個特有屬性，如
id
class
tagname等，
div
id="id-div"
class="class-div"。。。。。
分別使用
#id-div
\
.class-div
或者
直接
div，然后編輯對應(yīng)樣式，就可以實現(xiàn)對其樣式的控制了......
另外給你推薦個工具，
firefox瀏覽器下使用插件
firebug
學(xué)起來會比較快
:-)
重慶分公司
重慶分公司
