Box-shadow is to add a shadow to the box. Support for adding one or more.
Usage:
Box-shadow:x axis offset y-axis offset [shadow blur radius] [shadow expansion radius] [shadow color] [projection mode];
Code:
. boxshadow-outset{ width:100px; height:100px; Box-shadow:4px 4px 6px #666;}. Boxshadow-inset{ width:100px; height:100px; Box-shadow:4px 4px 6px #666 inset;}. Boxshadow-multi{ width:100px; height:100px; Box-shadow:4px 2px 6px #f00, -4px-2px 6px #, 0px 0px 12px 5px #33CC00 inset;}
The corresponding effect is as follows
1. The difference between shadow blur radius and shadow expansion radius
Shadow Blur radius: This parameter is optional, its value can only be positive, 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 is extended, the inverse value is negative, then zoom out;
2, X-axis offset and y-axis offset can be set to negative number
Primer http://www.imooc.com/code/382
The Box-shadow of CSS3