Real World XML

Creating Pseudo-Elements

Besides using elements as selectors for rules, you can use pseudo-elements. Two pseudo-elements exist in CSS1: first-letter, which refers to the first letter of a block of text, and first-line, which refers to the block's first line. Two more pseudo-elements were introduced in CSS2—before and after, which let you specify what should go immediately before and after elements. You use these pseudo-elements like this: P:first-letter to refer to the first letter of a <P> element.

Here's an example. In this case, I'm styling the first letter of <P> elements to be larger than the rest of the text and to be a “drop cap,” which means that it'll appear lower than the rest of the text on the first line (I'll specify that the top ...