Adding Drop Cap CSS
1. Log in to your Blogger Account and go to New Post or Edit Post (in case of post that has been created earlier)
2. Choose the HTML mode in Post Editor, you should have paragraph containing atleast 3-4 lines to apply this effect
3. Now find the letter to which you want to apply the drop cap effect under HTML mode of the editor.
4. Now add the following portion of CSS before the letter
<span style="float: left; font-size: 70px; font-weight: bold; line-height: 50px; margin: 0px 5px 0px 0px;
padding: 0px; position: relative;">
After adding these codes the letter with the codes will look like this
<span
style="float: left; font-size: 70px; font-weight: bold; line-height:
50px; margin: 0px 5px 0px 0px; padding: 0px; position: relative;">A</span> ( in this case the letter I have chose for drop cap is A)
5. Now click on Preview
6. After seeing the Drop cap in preview mode finally Save and Published the post
0 comments:
Post a Comment