我正在参加「码上掘金挑战赛」详情请看：码上掘金挑战赛来了！
实现
CSS3中新增了盒子阴影，我们可以使用box-shadow属性为盒子添加阴影。
语法：
box-shadow: h-shadow v-shadow blur spread color inset;
- box-shadow基本语法：
box-shadow：none|shadow[,shadow]*
shadow=length{2,4}&&color?
默认值：none
语法分析：
none：无阴影
第1个长度值：阴影水平偏移值。可为负值
第2个长度值：阴影垂直偏移值。可为负值
第3个长度值：可选，阴影模糊值。不允许负值
第4个长度值：可选，阴影外延值。不允许负值
color：设置对象的阴影的颜色。可以使用16进制颜色值，也可以使用英文单词，还可以采用rgba的表示法。
注意细节：
默认的是外阴影（outset）。但是不可以写这个单词，否则会导致阴影无效。 盒子阴影不占用空间，不会影响其他盒子排列。
- CSS3阴影种类
可以分文字阴影和盒模型阴影。而本章主要讲的是盒阴影 (box-shadow)，盒阴影与文本阴影一样，都可以代替具有阴影效果的图片，减少对服务器的请求压力！而使用方面来说，CSS3 的 box-shadow 有点类似于 text-shadow，只不过不同的是 text-shadow 是对象的文本设置阴影，而 box-shadow 是给对象实现图层阴影效果。当然我们有时候会用盒阴影来代替边框，这是因为盒阴影是不占物理空间的，而边框会，导致了移动端设置自适应宽度受到了影响，那么接下来我们来看看盒阴影的使用！
