模式
含義css3
選擇器型別
*任何元素
萬用字元選擇器
e型別為 e 的元素
型別選擇器
e.warning
類為 「warning」 的 e 元素
類選擇器
e#myid
id 等於 「myid」 的 e 元素
id 選擇器
e[foo]
帶 「foo」 屬性的 e 元素
屬性選擇器
e[foo=」bar」]
「foo」 屬性值恰為 「bar」 的 e 元素(引號是可選的)
屬性選擇器
e[foo~=」bar」]
「foo」 屬性為一組空格分隔的值,且其中之一恰為 「bar」 的e元素(引號是可選的)
屬性選擇器
e[foo^=」bar」]
「foo」 屬性以 「bar」 開頭的 e 元素(引號是可選的)
是屬性選擇器
e[foo$=」bar」]
「foo」 屬性以 「bar」 結束的 e 元素(引號是可選的)
是屬性選擇器
e[foo*=」bar」]
「foo」 屬性值在某處包含 「bar」 的 e 元素(引號是可選的)
是屬性選擇器
e[foo|=」en」]
「foo」 屬性為一組連字元分隔的值且(從左邊開始)以 「en」 開頭的 e 元素(引號是可選的)
屬性選擇器
e f作為 e 元素後代的 f 元素
後代結合符
e > f
作為 e 元素子元素的 f 元素
子元素結合符
e + f
緊接 e 元素後面的 f 元素
相鄰同胞元素結合符
e ~ f
位於 e 元素後面的 f 元素
是通用同胞元素結合符
e:root
e 元素,文件根元素
是結構偽類
e:nth-child(n)
e 元素,其父元素的第 n 個子元素
是結構偽類
e:nth-last-child(n)
e 元素,其父元素的倒數第 n 個子元素
是結構偽類
e:nth-of-type(n)
e 元素,該型別的第 n 個同胞元素
是結構偽類
e:nth-last-of-type(n)
e 元素,該型別的倒數第 n 個同胞元素
是結構偽類
e:first-child
e 元素,其父元素的第乙個子元素
結構偽類
e:last-child
e 元素,其父元素的最後乙個子元素
是結構偽類
e:first-of-type
e 元素,該型別的第乙個同胞元素
是結構偽類
e:last-of-type
e 元素,該型別的最後乙個同胞元素
是結構偽類
e:only-child
e 元素,其父元素的唯一子元素
是結構偽類
e:only-of-type
e 元素,該型別的唯一同胞元素
是結構偽類
e:empty
沒有子元素(含文字結點)的 e 元素
是結構偽類
e:link,e:visited
作為目標尚未訪問過(:link)或已經訪問過(:visited)的超連結的e元素
鏈結偽類
e:focus,e:hover,e:active
處於特定使用者操作下的 e 元素
使用者操作偽類
e:target
作為引用 uri 目標的 e 元素
是目標偽類
e:lang(fr)
語言為 「fr」 的 e 元素
:lang()偽類
e:enabled e:disabled
狀態為有效的或無效的使用者介面 e 元素
是ui 元素狀態偽類
e:checked
選中了的使用者介面 e 元素(如單選按鈕或 核取方塊)
是ui 元素狀態偽類
e::first-line
e 元素在格式上的第一行
::first-line 偽元素
e::first-letter
e 元素在格式上的第乙個字母
::first-letter 偽元素
e::before
e 元素之前的生成內容
::before 偽元素
e::after
e 元素之後的生成內容
::after 偽元素
e:not(s)
與簡單選擇器 s(例如 input:not(.warning)) 不匹配的 e 元素
是否定偽類
css選擇器語法速查
通用選擇器 類似於萬用字元,匹配文件中所有元素型別 型別選擇器 h1,h2,p 匹配以逗號隔開元素列表中的所有元素 類選擇器 glass or p.glass id選擇器 id or p id 子選擇器 td b 匹配元素是另外乙個元素的直接子元素 後繼選擇器 td b 匹配另乙個指定元素的所有巢狀...
css選擇器 CSS選擇器總結
在前不久的專案中,實習小妹妹在乙個全域性的樣式中使用了下面這個css選擇器 content 對應的html結構大致是 實習妹子大致的意思是想要讓content下的子元素div的高度100 但是貌似她沒有真正理解first child的意義,從而導致這個全域性的樣式讓 所有頁面都出現了問題,然後我就只...
JQuery選擇器速查列表
id id選擇器 div 元素選擇器 classname 類選擇器 classname,classname1,id1 組合選擇器 id id選擇器 div 元素選擇器 classname 類選擇器 classname,classname1,id1 組合選擇器 id classname 子元素選擇器 ...