One of my best blogger friend Dheeraj send me a guest post last day.The post contain the CSS and HTML code.But i have old idea to add CSS code into blogger post.
So in early morning today,i surfing on internet to add the new code box.And finally i got the success and add the latest code box.Hope you like my post.And special thanks to http://labstrikes.blogspot.in/ to share this article with us.
Want To See The Demo:-
.code1 {
overflow:auto;width:503px;height:200px;
font-family: "Consolas", "Courier New", Courier, mono, serif;
color:#848176;
margin : 15px 35px 15px 15px;
padding : 10px 10px 10px 35px;
clear : both;
list-style-type : none;
background : #000000 url(http://1.bp.blogspot.com/-nic37VqULoA/UDdTubWtwcI/AAAAAAAABbs/zv-i-PbnWHQ/s1600/labstrike-1.png) repeat-y top left;
border : 1px solid #000000;
border-left:20px solid #ccc;
-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition-duration:all .3s ease-in-out;transition:all .3s ease-in-out;-webkit-border-radius:3px;-moz-border--moz-border-radius: 23px 20px 20px 20px;border-radius: 23px 20px 20px
}
.code1:hover{
background : #000000 url(http://1.bp.blogspot.com/-alUx-JlZsZw/UDdT4qYXglI/AAAAAAAABb0/7ili3p2WHa4/s1600/labstrike-2.png) repeat-y top left;
color:#FEF9BF;
border : 1px solid #000;
border-left:20px solid #ccc;
-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, .3);
-moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, .3);
box-shadow: 0px 0px 10px rgba(0, 0, 0, .3);
box-shadow: 10px 10px 5px #888888;
}
So How To Add This:-1)Go to Blogger->Template->Edit Html->Proceed.
2)Now Search ]]>and add the CSS code from above demo just above it.
3)Save The Template.
4)Done How To Implement This To Your Blogger Post:-
When you want to add CSS/HTML/Javascript code to your blog post.Just go to HTML option and write the code as shown below.
<div class="code1">Write your code here</div>
Done.If any query leave a comment below.

No comments:
Post a Comment
Any Query, Suggestion Please Comment Here