Learning PHP, MySQL, JavaScript, and CSS, 2nd Edition

Pseudoelements

Pseudoelements are a means of adding content rather than style to an element. They are enabled by placing a colon after an element type specifier, followed by a pseudoelement. For example, to place some text before an element that uses the class offer, you could use a rule such as this:

.offer:before { content='Special Offer! '; }

Now any element using the class offer will have the string supplied to the content property displayed before it. Likewise, you can use the :after pseudoelement to place items after all links (for example), as with the following, which will follow all links on a page with the link.gif image:

a:after { url(link.gif); }