Wednesday 7 November 2012

How To Add Heading Tag With Drop Shadow And Mouse Hover Effect


Blogger  is one of the send one can endeavor with JavaScript code because it is more fascinating to creating anything their. In this substance i am feat to plow how to adding direction tag with discontinue overshadow and mouse hesitate belief. The blogger is not break you this write of but blogger is only utilize exclusive dolabrate hove upshot in blogger assemblage titles. Blogger Heroe plan this encipher with CSS3 advantage hear how to get the descent shadower and pussyfoot waffle effect in your journal denomination.


Adding drop shadow and mouse hover effect in Blogger post title


  • Go To Blogger > Design > Edit HTML
  • Backup your template
  • Search this using Ctrl + F
]]></b:skin>
Just above it paste the following code

 /*----bloggers-hero.blogspot.com Heading Tag----*/


    h3{
    font-family:Arial !important;
    font-style:italic !important;

    }
    .post h3 {
    color:#0000ff;
    border-left:10px solid #0000ff;
    border-right:10px solid #0000ff;
    padding:3px 5px 3px  20px;
    border-radius:15px;
    -moz-border-radius:15px;
    box-shadow:0px 0px 13px #0000ff;
    -webkit-box-shadow:0px 0px 13px #0000ff;
    -moz-box-shadow:0px 0px 13px #0000ff;


    }

    .post h3:hover {
    color:#f01a1a;
    border-left:10px solid #f01a1a;
    border-right:10px solid #f01a1a;
    box-shadow:0px 0px 13px #f01a1a;
    -webkit-box-shadow:0px 0px 13px #f01a1a;
    -moz-box-shadow:0px 0px 13px #f01a1a;
    }
  • If you are using h2 tag in your post tile then change h3-h2, .post h3-.post h2 and .post h3:hover-.post h2:hover.
  • Now save your template.

No comments:

Post a Comment