Best Blogging Tips and Templates,Windows and Web Applications & Games

How to Make First Letter Big in Size for Blog Posts

Posted: 16 Mar 2010 10:47 AM PDT

You might have seen in newspapers or even in some blog posts that there are paragraphs in which the first letter of the first word of the first line is bigger in size as compared to the rest of the letters.

You can also do the same thing in your blog posts—simply by Adding some CSS to your html code.

Your post's first letter (character) would become bigger than original tailgating font sizes. Now, you might have a question–How to do this? Well, to implement this in your blog, all you need to do is add some CSS code in your html code, and you will have the first letter of your blog post bigger in size. (See the sample image given below.)

Steps to make first letter big in size:

On your dashboard, click on Layout (see the image below.)

Next, click Edit HTML (see the image below.)

Then find the code ]]></b:skin> and replace it with the code given below.

.post-body:first-letter {
float:left;
color: #000000;
background:#ffffff;
line-height:80px;
padding-top:1px;
padding-right:5px;
font-family:times;
font-size:100px;
}
]]></b:skin>

Save your template and you are done :)