Unordered List

Thursday, February 21, 2013

Customize Bullet Style With Mouse Hover Effect In Your Blogger

Friends, Do you want to make your blogger is more beautiful. We are always add bullets to our posts but it appear like a black dot. Later i show how to change black bullets with your own image. In this post i share  a information about, How to apply mouse hover effect to your bullets. You can make it easy… Follow this post and enjoy……



bullet mouse hover effect for your blogger(techtoones.blogspot.com)
Log in to your Blogger account.
  • Select Templates


  • Click on Edit HTML


  • Tick on  Expand Widget Templates.

  • Find (Ctrl + F)   ]]></b:skin>


  • Copy  the code shown below and paste it before ]]></b:skin>


.post ul {list-style:none;
}
.post ul li {
    line-height: 1.0em;
        background: transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLqf7GqLZas1dO4OBUJWjYCtexjmF84_I-s6neuAWx59k1dNIRr67eLytUB_nC0mbrF1TVjWv0JjJf_zHBCpJb_IWmlcuxWdh2u7ZK1eb-m3wToxbJQYCqon-LjCzn1vw2jWNGi9bh3YA/s400/255.gif) no-repeat scroll -4px 0px;
    margin: 1.0em 0;
    padding: 0 0 1.0em 28px;
}
.post ul li:hover {
        background: transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgB_85dRiYOhvS8Rz1KDdT0Y8hKp2z9B-p4qCRysIXPB87-eC3U-zDcmSQQJRARzNSCaBiBkTjTn0vL_HkuutAZiE1uLNwVKSmTPBhQ4xHLTBGgqSRv3GfpawQoB1A7FjMlCJK36xe0cgg/s400/251.gif) no-repeat scroll -2px 0px;
}

Change RED color with your bullets URL

  • Now save it.



Leave a comment………………………………….

0 comments:

Post a Comment