Esküvő

CSS box shadow

You can create shadow for any block element, like divs.

Syntax

box-shadow: horizontal-offset vertical-offset blur spread color inset;

Values

The horizontal offset, positive means the shadow will be on the right of the box, a negative offset will put the shadow on the left of the box.
The vertical offset, positive one means the shadow will be below the box, negative one means the box-shadow will be above the box.
The blur radius (optional), if set to 0 the shadow will be sharp, the higher the number, the more blurred it will be.
The spread radius (optional), this it the size of the shadow.  Default value is 0, so the shadow is same size as blur.
Color is HEX color value, like #000 or #FFFFFF.
Inset (optional) changes the shadow from outer shadow to inner shadow.

To make sure CSS box shadow works fine in all browser use -moz- and -webkit- too.

CSS for outer shadow

.box-shadow {
 -moz-box-shadow: 5px 5px 5px 5px #DDD;
 -webkit-box-shadow: 5px 5px 5px 5px #DDD;
 box-shadow: 5px 5px 5px 5px #DDD;
}

CSS for inner shadow

.inner-shadow {
 -moz-box-shadow: 0 0 5px #000 inset;
 -webkit-box-shadow: 0 0 5px #000 inset;
 box-shadow: 0 0 5px #000 inset;
}

CSS for one side-only shadow

.side-only-shadow {
 -webkit-box-shadow: 0 10px 5px -5px #000;
 -moz-box-shadow: 0 10px 5px -5px #000;
 box-shadow: 0 10px 5px -5px #000;
}


Esküvő


Related articles

Vecteezy - Free Vector Art

Vecteezy - Free Vector Art

05/08/2016

If you need Free Vector Art do not hesitate: visit Vecteezy.com

Free vector icons

Free vector icons

31/01/2016

Want to have some vector icons, free? Try this nice website.

Beautiful free stock photos from StockSnap

Beautiful free stock photos from StockSnap

11/12/2015

Would you like some cool stock photos for free? Check out this article, and try this website.


Leave a comment

We welcome any comment from you! Please keep in mind that comments are moderated and rel='nofollow' is in use. So, please do not use a domain as your name or a spammy keyword, or your comment will be deleted.

Name: *

E-mail: *

Message: *

Click on the lion *


Find us on Facebook

Tags

Esküvő

Back to Top