Press "Enter" to skip to content

CSS Selectors, Pseudoclasses, and Pseudoelements

Selector Type Example Note
Universal selector * { color:#555; } /
Type selectors b { color:red; } div,p select all <div> elements and all <p> elements.
Class selectors .classname { color:blue; } /
ID selectors #idname { background:cyan; } /
Descendant selectors span em { color:green } Select all <em> elements who have a parent element of <span>.
Child selectors div > em { background:lime; } Select all <em> elements who have a direct parent element of <div>
Adjacent sibling selectors i + b { color:gray; } Select the <b> element who is directly after the <i> element, and meanwhile both the <i> and <b> elements should be within a same parent element.
Attribute selectors a[href=’info.htm’] { color:red; } /
Pseudoclasses a:hover { font-weight:bold; } /
Pseudoelements p::first-letter { font-size:300% } /

Be First to Comment