CSS3 Selectors: Pseudo-element ::after

As with the previous example, we can add a text content using ::after.

.
Another use case for ::after is to insert an attribute of the targeting element.
.
Here we retrieve the href using attr(href) and insert the href link after the text content.
<!DOCTYPE html>
<html>
<head lang='en'>
    <meta charset='UTF-8'>
    <title>Codecrawl.com - HTML5</title>
    <style>
        a[href^=http]:after {
            content: " (" attr(href) ")";
        }
    </style>
</head>
<body>
<a href='http://yahoo.com'>I am going to yahoo!</a>
</body>
</html>
Series Navigation<< CSS3 Selectors: Pseudo-element ::before
CSS3 Selectors: Negation pseudo-class :not(s) >>