CSS shadows

box-shadow

box-shadow: h-shadow v-shadow blur spread color inset;

Attributes:

h-shadow - position of the horizontal shadow. Negative values are allowed
v-shadow - position of the vertical shadow. Negative values are allowed
blur - blur distance (optional)
spread - positive values increase the size of the shadow, negative values decrease the size. Default is 0 (the shadow is same size as blur, optional)
color - color of the shadow (optional)
inset - changes the shadow from an outer shadow (outset) to an inner shadow (optional)

box-shadow: 10px 10px 5px #888;

box-shadow: 10px 10px 5px #888 inset;

box-shadow: 5px 5px #888;

box-shadow: 5px 5px 2px #888;

box-shadow: 0 0 2px #888;

box-shadow: 0 0 2px 2px #888;

box-shadow: 0 8px 6px -6px #888;

box-shadow: 0 8px 6px -6px #888;

text-shadow

text-shadow: h-shadow v-shadow blur color;

text-shadow: 2px 2px 1px #888;

Lorem ipsum dolor sit amet, eu usu vidisse feugait volumus, velit congue graeci vis cu. Ex dolore tempor doming qui. Eam minim mazim et, maiorum tibique te sea. Pro an epicuri recteque inciderint, nec no salutandi quaerendum. Affert nostrum eu sit, pri at invidunt oporteat legendos. Prima harum dicunt nam ei, ut duo esse consequuntur.

Mixin:

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

Links:

Licensed under CC BY-SA 3.0