-

24 September 2012

HOW TO ADD CSS BOX SHADOW TO IMAGES

VM | 2:09 am |
If your Images are having box shadow then it will look great, In my opinion box shadow makes images quality better (high definition)  If you want to add box shadow to your blog or website follow below steps-

Box shadows are divided in three part-


  • Outer
  • Inner
  • One Sided
To Add Box Shadow To Website Copy The Following Css Code And Paste It in Your Website Css Code.

If you want to add it in blogger then you need to paste it above ]]></b:skin> 



Outer


.post-body img {
-moz-box-shadow: 3px 3px 5px 6px #ccc;
-webkit-box-shadow: 3px 3px 5px 6px #ccc;
box-shadow: 3px 3px 5px 6px #ccc;
}

Inner




.post-body img {
-moz-box-shadow: inset 0 0 10px #000000;
-webkit-box-shadow: inset 0 0 10px #000000;
box-shadow: inset 0 0 10px #000000;
}

One Sided




.post-body img {
-webkit-box-shadow: 0 8px 6px -6px black;
-moz-box-shadow: 0 8px 6px -6px black;
box-shadow: 0 8px 6px -6px black;
}



OR OTHER STYLE

.post-body img {
padding:4px;
border:1px solid #AAAAAA;
background-color:#F0F0F0;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow:black 0 15px 10px -12px;
}

Change What ever you want color    #AAAAAA#F0F0F0;

No comments:

Post a Comment

Related Posts Plugin for WordPress, Blogger...

Subscribe Updates, Its FREE!