WebDevBoost.co.uk - CSS - CSS First Letter Styling (:first-letter) Script

Stay informed - Newsletter Signup

CSS First Letter Styling (:first-letter)

Dated Added: 4th August 2008

Have you always wanted to simply style the first letter of a sentence without having to extract or do a code solution? Well CSS provides you with a pseudo element that makes that easy!

Example Code:

Running Code:

Do you notice the 'D' at the beginning of the sentence?

Copy Code:

<style>
.para p { 
font-size: 12pt
}
.para p:first-letter {
color:#00CC00;
font-size:16px;
font-weight: bold;
border: 1px #000000 solid;
padding: 10px;
}
</style>

<div class="para">
<p>Do you notice the 'D' at the beginning of the sentence?</p>
</div>

	Script Updates
	Ajax
	ASP
	ASP.NET
	CSS
	HTML
	Java
	Javascript
	PHP
	Python
	Ruby on Rails
	Useful Tools
	XML

	Request Help
	Request a Script
	Request WebDev
	Contact Us
	About Us

	Ajax Scripts \| ASP Scripts \| ASP.NET Scripts \| HTML Scripts \| Javascript Scripts \| PHP Scripts \| Python Scripts \| Ruby on Rails Scripts \| XML Scripts
	2001-2007 © All Rights Reserved. 3Branch Internet Development. All content is available under the GPL