blob: c1051eeb95c8da6927a36e7ee65eb6156549efd8 [file] [log] [blame]
<!DOCTYPE html>
<html>
<!--
| Use the :after pseudo element to add text.
| Also test correct cascading.
-->
<head>
<style>
body {
margin: 0px;
font-size: 18px;
}
p {
margin: 0px;
font-size: 20px;
color: #00f;
}
p:after {
content: '!!!';
font-size: 2em;
}
div:after {
content: ' when this is ignored...';
font-size: 18px;
}
div:after {
content: ' and so on...';
color: #090;
}
div.chocolate {
background-color: #cff;
font-size: 24px;
}
div.chocolate:after {
content: ' with chocolate!';
font-weight: bold;
color: #630;
}
div.thrill:after {
content: ' for the thrill';
}
span:after {
content: ' [spam] ';
}
</style>
</head>
<body>
<p>Bazinga</p>
<div>Smile</div>
<div>Cobalt rulez!</div>
<div class='chocolate'>Better</div>
<div class='thrill'> live </div>
<div class='chocolate'>Better <span>...</span></div>
<div class='thrill'>Yes<span> be sure to </span> live </div>
<span>Oh</span>
</body>
</html>