Here is a simple way of creating beautiful and colorful Popular Posts Widgets for your Blog using CSS. First you have to login into blogger account, then select template>Edit HTML now search ]]></b:skin> to your blog HTML and CSS code, after that Paste below code just above this tag and Save the Template.
Codes
Codes
.PopularPosts .item-title { display:none; } .PopularPosts .widget-content ul li { background: none repeat scroll 0 0 transparent; float: right; list-style: none outside none; margin: 10px 0 0 !important; padding: 0 !important; } .PopularPosts .item-thumbnail { margin: 0 8px !important; } #PopularPosts1 img:hover{-moz-transform: scale(1.2) rotate(-350deg);-webkit-transform: scale(1.2) rotate(-350deg);-o-transform: scale(1.2) rotate(-350deg);-ms-transform: scale(1.2) rotate(-350deg);transform: scale(1.2) rotate(-350deg);-webkit-box-shadow: 0 0 0px rgba(255,0,0,.4), inset 0 0 0px rgba(255,255,255,1);-moz-box-shadow: 0 0 0px rgba(255,0,0,.4), inset 0 0 0px rgba(255,255,255,1);box-shadow: 0 0 0px rgba(255,0,0,.4), inset 0 0 0px rgba(255,255,255,1);} .item-thumbnail img { -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease; border: 3px solid #ccc; height: 60px; padding: 3px; width: 60px; }
And Your done:
0 comments:
Post a Comment