Source code
Revision control
Copy as Markdown
Other Tools
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<head>
<title>::first-letter pseudo-element with ::before pseudo-element</title>
<style type="text/css"><![CDATA[p::first-letter { color: lime; font-size: xx-large; }
p::before { color: red; content: 'T'; }]]></style>
<link rel="author" title="Ian Hickson" href="mailto:ian@hixie.ch"/>
<link rel="help" href="https://www.w3.org/TR/css3-selectors/#selectors"/> <!-- bogus link to make sure it gets found -->
</head>
<body>
<p>his very long paragraph should
have a big green first letter T. Dummy text. Dummy
text. Dummy text. Dummy text. Dummy text. Dummy text. Dummy
text. Dummy text. Dummy text. Dummy text. Dummy text. Dummy
text. Dummy text. Dummy text. Dummy text. Dummy text. Dummy
text. Dummy text. Dummy text. Dummy text. Dummy text. Dummy
text. Dummy text. Dummy text. Dummy text. Dummy text. Dummy
text. Dummy text. Dummy text. Dummy text. Dummy text. Dummy
text. Dummy text. Dummy text. Dummy text. Dummy text. Dummy
text. Dummy text. Dummy text. Dummy text. Dummy text. Dummy
text. Dummy text. Dummy text. Dummy text. Dummy text. Dummy
text. Dummy text. Dummy text. Dummy text. Dummy text. Dummy
text. Dummy text. Dummy text. Dummy text. Dummy text. Dummy
text. Dummy text. Dummy text. Dummy text. Dummy text. Dummy
text. Dummy text. Dummy text. Dummy text. Dummy text. Dummy
text. Dummy text. Dummy text. Dummy text. Dummy text. Dummy
text. Dummy text. Dummy text. Dummy text. Dummy text. Dummy
text. Dummy text. Dummy text. Dummy text. Dummy text. Dummy
text. Dummy text. Dummy text. Dummy text. Dummy text. Dummy
text. Dummy text. Dummy text. Dummy text. Dummy text. Dummy
text. Dummy text. Dummy text. Dummy text.</p>
</body>
</html>