CSS3 Box-shadow (Shadow use)

From:http://jingyan.baidu.com/article/03b2f78c4d9fae5ea237aea6.html

CSS3 Box-shadow inner Shadow and outer shadow

1-

Box-shadow specific use method, syntax:

E {box-shadow:inset x-offset y-offset blur-radius Spread-radius Color} In other words: Object selector {text-shadow: Projection mode x-axis offset y-axis offset shadow blur radius shadow extension Radius Shadow Color}

Value: Delivery Method: The default is the outer shadow,

The Box-shadow property has a maximum of 6 parameter settings, each of which is evaluated:

Shadow type: This parameter is an optional value, and if no value is set, its default projection is an outer shadow, and if its unique value is "inset", the outer shadow becomes an inner shadow, that is, when the shadow type is "inset", its projection is the inner shadow;

X-offset: Refers to the shadow horizontal offset whose value can be positive or negative, if the value is positive, the shadow is on the right side of the object, and the value is negative, the shadow is on the left side of the object;

Y-offset: Refers to the vertical offset of the shadow, its value can also be positive negative, if it is positive, the shadow at the bottom of the object, and conversely its value is negative, the shadow at the top of the object;

Shadow Blur radius: This parameter is optional, but its value can only be positive, and if its value is 0 o'clock, indicates that the shadow does not have a blur effect, the greater the value of the shadow the more blurred the edge;

Shadow expansion radius: This parameter is optional, its value can be positive negative, if the value is positive, then the entire shadow expands, the inverse value is negative, then shrinks

-moz-box-shadow:5px 5px 5px #999 inset; -webkit-box-shadow:5px 5px 5px #999 inset; box-shadow:5px 5px 5px #999 inset;

-moz-box-shadow:-5px-5px 5px #999 inset; -webkit-box-shadow:-5px-5px 5px #999 inset; box-shadow:-5px-5px 5px #999 inset;

CSS3 Box-shadow (Shadow use)