Css selectors
From wikinotes
Selectors determine what the following block of CSS applies to.
Documentation
w3schools css selectors reference https://www.w3schools.com/cssref/css_selectors.asp MDN css https://developer.mozilla.org/en-US/docs/Learn/CSS/First_steps MDN css selectors https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Selectors
Selectors
element/class/id
li { ... } /* elements of type 'list' */ .class { ... } /* elements of class 'class' */ #id { ... } /* elements with id 'id' */ li.class { ... } /* list element of class 'class' */attributes
a[title] { ... } /* a elements with attribute 'title' defined */ a[href="https://foo.com"] { ... } /* a elements with attribute 'href' and value 'https://foo.com' */pseudo class/elements
a:hover { ... } /* when 'a' has the 'hover' pseudo-class */ p::first-line { ... } /* the pseudo-element 'first-line' of 'p' */hierarchy
* li em { ... } /* 'em' elements at any level under 'li' */ li + em { ... } /* 'em' elements that are direct children of 'li' */misc
li, em /* select both 'li' and 'em' elements */state
a:hover { ... } /* 'a' elements when under cursor */