Web Design in a Nutshell, 3rd Edition

Selector Summary

Table 17-1 provides a quick summary of the selectors covered in this chapter. Put a sticky-note on this page.

Table 17-1. Summary of selectors

Selector	Type of selector	Description
*	Universal selector	Matches any element. * {font-family:serif;}
A	Type selector	Matches the name of an element. div {font-style: italic;}
A B	Descendant selector	Matches element B only if it is a descendant of element A. blockquote em {color: red;}
A>B	Child selector	Matches any element B that is a child of any element A. div.main>p {line-height:1.5;}
A+B	Adjacent sibling selector	Matches any element B that immediately follows any element A. p+ul {margin-top:0;}
.classname A.classname	Class selector	Matches the value of the class attribute in all elements or a specified element. p.credits {font-size: .8em;}
#idname A#idname	ID selector	Matches the value of the id attribute in an element. #intro {font-weight: bold;}
A[att]	Simple attribute selector	Matches any element A that has the given attribute defined, whatever its value. table[border] {background-color: white;}
A[att="val"]	Exact attribute value selector	Matches any element B that has the specified attribute set to the specified value. table[border="3"] {background-color: yellow;}
A[att~="val"]	Partial attribute value selector	Matches any element B that has the specified value as one of the values in a list given to the specified attribute. table[class~="example"] ...