Pseudo Elements

Normally, all the elements that are selected are normal elements that are part of the document tree. Pseudo elements are special elements that are not part of the document tree. These elements are defined in the CSS Recommendation, and can be used by you to accomplish special formatting tricks, such as a dropped cap.

• :first-letter— This pseudo element represents the first letter in a block of text. This can be useful for designing elements such as an initial, or drop, cap.

• :first-line— This pseudo element represents the first line in a section of text, which could be used to create an initial line of small caps or a similar graphic element.

Pseudo elements are selected by appending the pseudo-element onto the element it is altering. For example, to select the pseudo element first-letter of an <h2> element, you would use the syntax

H2:first-letter {color: blue} 

which would result in the first letter of all <H2> elements appearing blue.