Tip 11Making Links Printable with :after and content

CSS can style existing elements, but it can also inject content into a document using the :before and :after pseudoelements and the content property. There are a few cases where content generation with CSS makes sense, and the most obvious one is when appending the URL of a hyperlink next to the link’s text when a user prints the page. When you’re looking at a document on the screen, you can just hover over a link and see where it goes by looking at the status bar. However, when you look at a printout of a page, you have absolutely no idea where those links go.

AwesomeCo is working up a new page for its forms and policies, and one of the members of the redesign committee insists on printing ...

Get HTML5 and CSS3, 2nd Edition now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.