投影 box-shadow
定义：box-shadow：h-shadow, v-shadow, blur, spread, color, inset
下面分别介绍以上各个属性的意义，color最容易理解，就是阴影的颜色呗，这个不做测试了。
先来介绍h-shadow和v-shadow，字面的理解是水平方向和垂直方向的投影。在这里指的是水平方向和垂直方向的投影相对于原始位置的偏移量。而原始位置，指的是当h-shadow和v-shadow都是0的时候阴影的位置，即在box的正下方。
box-shadow: 0 0 0 0 red; box-shadow: 5px 5px 0 0 red;
box-shadow: inset 5px 5px 0 0 red;
大家看下差别，应该就明白v-shadow和h-shadow的含义了，默认情况下，投影是在原block最下方的，投影被盖住了，所以，没看出来什么变化。当设置各个方向的偏移分别为5px时，可以看到投影往右下方分别移动了5px的距离。而inset的含义是投影是在右下还是左上。
接着介绍blur和spread的含义，它们从字面上理解是模糊和拓展的意思，所以，blur的功能是让阴影模糊化，spread的功能是让阴影扩大。下面看下效果。
box-shadow: 5px 5px 10px 0 red;
box-shadow: 5px 5px 50px 0 red;
由上图可知，blur主要将投影虚化，距离越大，虚化的越厉害。
box-shadow: 5px 5px 0px 10px red; box-shadow: 5px 5px 0px 20px red;