Monday, 18 March 2013

How To Make Heading Style In Blogger


  • Go To Blogger Dashboard
  • Click on Template tab.
  • Now click on Edit HTML button
  • Find  ]]></b:skin>  
  • Paste any heading code above on   ]]></b:skin>  

Heading Style 1

DemO Herw

.post h2 {
color:#666;
border-left:10px solid #666;
border-right:10px solid #666;
padding:3px 5px 3px  20px;
border-radius:15px;
-moz-border-radius:15px;
box-shadow:0px 0px 13px #666;
-webkit-box-shadow:0px 0px 13px #666;
-moz-box-shadow:0px 0px 13px #666;
}
.post h2:hover {
color:#FF133F;
border-left:10px solid #FF133F;
border-right:10px solid #FF133F;
box-shadow:0px 0px 13px #FF133F;
-webkit-box-shadow:0px 0px 13px #FF133F;
-moz-box-shadow:0px 0px 13px #FF133F;
}
  • Use this by click on HTML button in New Post 
  • Then type <h2>Demo Here</h2>
  • Result will be show like as above demo

Heading Style 2

DemO Here

.post h4{
color:#0080ff;
border-top:1px solid #289728;
border-bottom:1px solid #289728;
font-size: 12pt;
padding:3px;
}
  • Use this by click on HTML button in New Post 
  • Then type <h4>Demo Here</h4>
  • Result will be show like as above demo

Heading Style 3

DemO Here

.post h3{
color:#FF0000;
border-top:1px solid #FF0000;
border-bottom:1px solid #FF0000;
font-size: 12pt;
padding:3px;
}
  • Use this by click on HTML button in New Post 
  • Then type <h3>Demo Here</h3>
  • Result will be show like as above demo

Customized Color and style

All the Codes above are use simple properties which are given below
you can change also above code from color code (Use Hex code for changing new color), Give 1px to 2 px for dark line, you can also change font size 12pt to 14 pt, 16pt as per your requirement. 
If you want to doted line than change word from above code solid to dotted

0 comments:

Post a Comment

Powered by Blogger.