作用：css選擇器主要用來對網頁中的元素進行設定樣式###css選擇器的規範寫法
標籤名作用：根據元素的class值進行選取元素####語法
.classname作用：根據元素的id屬性值選取元素####語法
#id作用：可以同時使用多個選擇器，這樣可以選擇同時滿足多個選擇器的元素。####語法
選擇器1選擇器2作用：可以同時使用多個選擇器，多個選擇器將被同時應用指定的樣式####語法
選擇器1，選擇器2，選擇器3作用：可以選中頁面中所有的元素####語法
*作用：後低選擇器可以根據標籤的關係，為處在元素內部的代元素設定樣式####語法
祖先元素 後代元素 後代元素**選擇器
1plate
元素選擇器
2bento
元素選擇器
3#fancyid
id選擇器
4子元素選擇器
5#fancy pickle
子代選擇器
6.small
類選擇器
7bento.small,plate.small
子代選擇器、分組選擇器、類選擇器
8bento orange
子代選擇器
9plate,bento,plate
元素選擇器、分組選擇器10*
通用選擇器
11plate>*
子代選擇器、通配選擇器
12兄弟選擇器（後邊乙個元素）
13bento~pickle
兄弟選擇器（後邊所有元素）
14子代選擇器
15plate>orange:first-child
子元素選擇器（為第乙個子元素）
16並集選擇器（選擇父元素只包含乙個同型別子元素）
17並集選擇器
18:nth-child(3)
子元素選擇器（為指定位置的子元素）
19:nth-last-child(4)
子元素選擇器（為bento標籤第乙個子元素）
2021
plate:nth-of-type(even)
子元素選擇器 （為plate標籤偶數子元素）
22plate:nth-of-type(2n+3)
子元素選擇器（選擇第2n+3個plate元素）【公式2n+3中n是計數器（從0開始）3是偏移值】
2324
子元素選擇器（選擇最後乙個標籤）
25bento:empty
選擇bento標籤沒有子元素的元素
26子元素選擇器 （否定偽類）
有時候，你需要選擇本身沒用標籤，但是仍然易於識別的網頁部位，比如段落首行或滑鼠滑過的鏈結，css為他們提供一些選擇器：偽類和偽元素#給鏈結定義樣式
###正常鏈結
a:linka:visited（只能定義字型顏色）a:hovera:active:focus:before:after::selecti:first-letter:first-line[屬性名]
[屬性名="屬性值"]
[屬性名~="屬性值]
[屬性名|="屬性值]
[屬性名^="屬性值]
[屬性名$="屬性值]
[屬性名*="屬性值]
作用：子元素選擇器可以給另乙個元素的子元素設定樣式
父元素 > 子元素 {}:first-child:last-child:nth-child:first-of-type
:last-of-type
:nth-of-type
作用:除了根據祖先父子關係，還可以根據兄弟元素查詢元素
兄弟元素 + 兄弟元素{}
查詢後邊乙個兄弟元素
兄弟元素 ~ 兄弟元素{}
查詢後邊所有的兄弟元素
作用:否定偽類可以幫助我們選擇不是其他東西的某件東西
:not(選擇器){}為父元素設定了字型顏色，子元素也會應用相同的顏色，當然並不是所有的樣式都會被繼承
作用：在頁面中使用css選擇器選中元素時，經常都是乙個元素同時被多個選擇器選中選擇器###權重的計算
不同的選擇器有不同的權重值
權重內聯樣式
1000
id選擇器
100類，屬性，偽類選擇器
10元素選擇器
1萬用字元
0
CSS選擇器和其他選擇器
lang en charset utf 8 選擇器title ctrl shift 群組選擇器 box,color,span 選中ol標籤裡的li標籤 ol li ul red 直接子元素選中 box2 div 相鄰兄弟 span p 普通兄弟 span p style head box boxdi...
css選擇器 權重
基礎選擇器 一 標籤選擇器 p h1 css不區分大小寫，建議小寫 1 所有的標籤都可以作為標籤選擇器去使用 2 無論這個標籤藏多深，一定能夠被選上 3 選擇頁面所有的，而不是具體某乙個 標籤選擇器，選擇的是頁面上所有這種型別的標籤，所以經常描述 共性 無法描述某乙個元素的 個性 的。二 id選擇器...
CSS選擇器，深入理解CSS選擇器權重
前端工程師經常和選擇器權重打交道，但是部分人還是一知半解，下面咱們一起學習一下吧。類選擇器 active 標籤選擇器 div 屬性選擇器 img alt 通用選擇器 選擇器權重 這裡的 權 和是數學中加權平均數的 權 乙個意思。當同時多個css選擇器語句的目標是同乙個html元素時，選擇器權重就派上...