CSS Selectors Flashcards
what is a css selector
a pattern rule that matches style rules to a specific element or elements
css selector: type
match elements by node name
css selector: .class
matches elements based on the contents of the element’s class attribute
css selector: #id
match an element based on the contents of that element’s id attribute
css selector: *
universal selector, matches all elements on the page
css selector: element > element
child selector, matches an element that is a direct child of another
css selector: element element
descendant selector, matches an element that is a descendent of another specified element
css selector: element + element
adjacent sibling selector, matches an element that is the next sibling of another
css selector: element ~ element
general sibling selector, matches an element that is a sibling of another
css selector: element[attr]
represents an element with an attribute name of attr
css selector: element[attr=”value”]
represents an element with an attribute name of attr and whose value is exactly “value”
css selector: element[attr~=”value”]
represents an element with an attribute name of attr whose value is a whitespace-separated list of words, one of which is exactly “value”
css selector: element[attr|=”value”]
represents an element with an attribute name of attr. Its value can be exactly “value” or can begin with “value”
css selector: element[attr^=”value”]
represents an element with an attribute name of attr and whose first value is prefixed by “value”
css selector: element[attr$=”value”]
represents an element with an attribute name of attr and whose last value is suffixed by “value”
