最終更新:2020-11-07 (土) 20:37:20 (1257d)
CSSセレクタ
Top / CSSセレクタ
https://developer.mozilla.org/ja/docs/Learn/CSS/Building_blocks/Selectors
W3C
種類
id,class,attribtue
hoge#huga //id = huga hoge.huga //class = huga hoge.huga.foo //class = huga and foo hoge[foo=bar] //foo属性がbar hoge[foo^=bar] //foo属性がbarで始まる hoge[foo$=bar] //foo属性がbarで終わる hoge[foo*=bar] //foo属性がbarを含む
子孫セレクタ
tag1 tag2{}//子孫( ) tag1 > tag2{}//直接の子(>) tag1 + tag2{}//次のノード(+) tag1 ~ tag2{}//一個前
擬似クラス
E:root //an E element, root of the document E:nth-child(n) //an E element, the n-th child of its parent E:nth-last-child(n) //an E element, the n-th child of its parent, counting from the last one E:nth-of-type(n) //an E element, the n-th sibling of its type E:nth-last-of-type(n) //an E element, the n-th sibling of its type, counting from the last one E:first-child //an E element, first child of its parent E:last-child //an E element, last child of its parent E:first-of-type //an E element, first sibling of its type E:last-of-type //an E element, last sibling of its type E:only-child //an E element, only child of its parent E:only-of-type //an E element, only sibling of its type E:empty //an E element that has no children (including text nodes) E:link //an E element being the source anchor of a hyperlink of which the target is not yet visited (:link) or already visited (:visited) E:visited // E:active //an E element during certain user actions E:hover // E:focus // E:target //an E element being the target of the referring URI E:lang(fr) //an element of type E in language "fr" (the document language specifies how language is determined) E:enabled //a user interface element E which is enabled or disabled E:disabled // E:checked //a user interface element E which is checked (for instance a radio-button or checkbox) E::first-line //the first formatted line of an E element E::first-letter //the first formatted letter of an E element E::selection //the portion of an E element that is currently selected/highlighted by the user E::before //generated content before an E element E::after //generated content after an E element E.warning //an E element whose class is "warning" (the document language specifies how class is determined). E:not(s) //an E element that does not match simple selector s
