box-shadow属性分析

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

以上六个值的含义:         h-shadow   水平阴影的位置,允许负值;

             v-shadow   垂直阴影的位置,允许负值;

             blur             阴影模糊程度;

             spread        阴影扩展尺寸;

             color           阴影颜色;

             inset           设置为内阴影(默认为外阴影);

例子:

往左—第一个值为负                     往右—第一个值为正                     往上—第二个值为负                     往下—第二个值为正         

box-shadow:-20px 0 2px 0 red;  box-shadow:20px 0 2px 0 red;  box-shadow:0 -20px 2px 0 red; box-shadow:0 20px 2px 0 red;

box-shadow属性分析_第1张图片   box-shadow属性分析_第2张图片         box-shadow属性分析_第3张图片                  box-shadow属性分析_第4张图片

 往四周—第一第二个值都为0

 box-shadow:0 0 30px 0 red;

box-shadow属性分析_第5张图片

你可能感兴趣的:(box-shadow属性分析)