Friday, June 8, 2012

This is a trick about adding box shadow css to your blog or website. for example look at picture in left side.

Example shadow A shows a shadow offset to the left and top by 5px:
#shadow_A {
-moz-box-shadow: -5px -5px #888;
-webkit-box-shadow: -5px -5px #888;
box-shadow: -5px -5px #888;
}

Example shadow B shows the same shadow with a blur distance of 5px:
#shadow_B {
-moz-box-shadow: -5px -5px 5px #888;
-webkit-box-shadow: -5px -5px 5px #888;
box-shadow: -5px -5px 5px #888;
}

Example shadow C shows the same shadow with a spread distance of 5px:
#shadow_C {
-moz-box-shadow: -5px -5px 0 5px #888;
-webkit-box-shadow: -5px -5px 0 5px#888;
box-shadow: -5px -5px 0 5px #888;
}

Example  shadow D shows the same shadow with both a blur distance of 5px and a spread distance of 5px:
#shadow_D {
-moz-box-shadow: -5px -5px 5px 5px #888;
-webkit-box-shadow: -5px -5px 5px 5px#888;
box-shadow: -5px -5px 5px 5px #888;
}

Example shadow E shows a shadow with no offset and a blur distance of 5px:
#shadow_E {
-moz-box-shadow: 0 0 5px #888;
-webkit-box-shadow: 0 0 5px#888;
box-shadow: 0 0 5px #888;
}

Example shadow F shows a shadow with no offset and both a blur distance of 5px and a spread distance of 5px:
#shadow_F {
-moz-box-shadow: 0 0 5px 5px #888;
-webkit-box-shadow: 0 0 5px 5px#888;
box-shadow: 0 0 5px 5px #888;
}
Source : CSS INFO

Copyright © 2013 Free Download Software Full Version | Powered by Blogger