乙個容易被忽視的css選擇器

2021-09-26 20:37:38 字數 2604 閱讀 3448

之前學的的迷糊了,也不知道什麼會什麼不會了,跑去面試了。別人列出一堆css選擇器,本以為選擇器沒啥的,結果到那個多類選擇器翻車了,.a.b選擇同時含a,b類名的,很尷尬所以回來仔細整理了一下。目前根據w3c手冊所知,選擇器一共44個,特此分類記錄複習一下(分類依據可能不合理,只是為了方便自己記憶)

一.基本選擇器(4個)

選擇器選擇目標

css*

萬用字元,選擇所有元素

2.class

類選擇器,選擇類名為class的元素

1#id

id選擇器,選擇id為id的元素

1element

元素選擇器,選擇element元素1

二.結合選擇器(6個)

選擇器選擇目標

css.a.b多類選擇器,選擇同時擁有類名為a,b的元素

a b後代選擇器 ,選擇a元素後代的所有b元素

1a,b

同級選擇器 ,選擇a元素和b元素

1a>b

子代選擇器,選擇a元素的直接子代b

2a b

直接相鄰兄弟選擇器,選擇緊跟著a元素的b元素

2a~b

通用兄弟選擇器,選擇前面有a的所有b元素3

注意事項: 1. 相鄰兄弟選擇器,之間可以有文字元素,不影響,其它不可。2.在 ie7 之前的版本中,不同平台的 internet explorer 都不能正確地處理多類選擇器。

三.偽元素(4個)

選擇器選擇目標

css:first-letter

選擇首字

1:first-line

選擇首行

1:before

在元素之前插入

2:after

在元素之後插入2

注意事項: 1. 所有偽元素都必須放在該偽元素選擇器的最後面 2. 偽元素是一種假想的元素,插入到頁面中代替某個元素但是並不出現在文件源**中,由使用者**動態構建。

四.屬性選擇器(7個)

選擇器選擇目標

css[attr]

簡單屬性選擇器,選擇含有attr屬性的元素

2[attr=value]

具體值屬性選擇器,選擇attr屬性值等於value的元素

2[attr~=value]

選擇attr屬性中含有value詞條的元素

2[attr|=value]

選擇attr屬性以value-開頭,或者等於value的元素

2[attr*=value]

子串匹配,選擇attr屬性子串包含value的所有元素

3[attr^=value]

選擇attr屬性以value開頭的元素

3[attr$=value]

選擇attr屬性以value結尾的元素3

五.偽類(23個)

表單相關(3)

選擇器選擇目標

css:checked

選中的input元素

3:disabled

選中禁用的input元素

3:enabled

選中啟用的input元素3

超連結相關,love-focus-hate.(5)

選擇器選擇目標

css:link

未被訪問的連線

3:visited

已經被訪問的連線

3:focus

獲取焦點的元素

3:hover

滑鼠懸浮的元素

3:actived

活動的元素3

同一父元素下的目標選擇(9)

選擇器選擇目標

cssp:only-child

選擇其父元素下的唯一子元素p下的所有元素

3p:only-of-type

選擇屬於其父元素唯一的 p元素的每個 p元素

3p:first-of-type

選擇屬於其父元素的首個p 元素的每個 p 元素。

3p:last-of-type

選擇屬於其父元素的最後 p元素的每個 p元素

3p:nth-child(n)

選擇屬於其父元素的第n個子元素的每個 p 元素 (n從1開始)

3p:nth-last-child(n)

從最後乙個子元素開始計數

3p:nth-of-type(n)

選擇屬於其父元素第n個p元素的每個p元素

3p:nth-last-of-type(n)

從最後乙個元素開始計數

3p:last-child

選擇屬於其父元素最後乙個子元素每個p元素3

其它(6)

選擇器選擇目標

css:root

選擇文件根元素

3:lang(language)

選擇帶有以 "language" 開頭的 lang 屬性值的元素

2:empty

選擇沒有子元素的元素(包括文字節點)

3:target

選擇當前活動的元素,錨點指向的元素

3:not(selector)

選擇非某個元素的所有元素

3::selection

選擇被使用者選取的元素部分3

六.css權重

學習Drupal乙個容易被忽視的問題

剛剛修復了乙個問題,乙個非常小的問題,但我花了2 3小時才查明原因並修復。總結下來我忽視了乙個非常常見的問題或者沒有養成乙個好的習慣。這是乙個非常明顯的許可權問題。我首先來到了許可權設定頁面,admin people permissions 搜尋和forum有關的許可權設定,沒有發現異常,但是請注意...

乙個被忽視的流量入口

接招 id itakethat 文丨方浩 這些年,雖然已經從bat三巨頭之中掉隊,但關於搜尋市場的競爭始終有一種論調 戰爭結束了。前段時間瘋傳google之時,很多人也不看好這家全球搜尋巨頭在中國的前景。理由很簡單 搜尋是乙個很難有重大創新突破的市場,一旦形成壟斷性的市場份額,很容易一家獨大。和go...

c 容易被忽視的細節序列 (一)

1.std size t numdigits int number 函式返回型別被定義為std size t 這表示size t是被定義在std命名空間之內。std幾乎是所有c 標準程式庫元素的棲身之處。另外size t只是乙個typedef,是c 計算個數時用的不帶正負號型別 unsigned 例...