CSS3 shadow 属性

一、box-shadow 属性

基础说明：

外阴影：box-shadow: X轴  Y轴  Rpx  color1,X轴  Y轴  Rpx  color2,...;
属性说明（顺序依次对应）： 阴影的X轴(可以使用负值)    阴影的Y轴(可以使用负值)    阴影模糊值（大小）    阴影的颜色

内阴影：box-shadow: X轴  Y轴  Rpx  color1 inset,X轴  Y轴  Rpx  color2 inset,...;
默认是外阴影   内阴影：inset 可以设置成内部阴影

注（PS）：此属性使用于盒模型 如(div,p,h1,h2,h3,h4,h5,h6等)不是用来设置文字阴影   
如果设置文字阴影请参考知识点:text-shadow（同理）

因为是新属性，为了兼容各主流浏览器并支持这些主浏览器的较低版本，基于主流浏览器上使用box-shadow属性时，
我们需要将属性的名称写成-webkit-box-shadow的形式，Firefox浏览器则需要写成-moz-box-shadow的形式，
欧朋浏览器-o-box-shadow，IE>9 -ms-box-shadow    

二、text-shadow 属性

text-shadow 曾经在 CSS2 中就出现过，但在 CSS 2.1版本中又被抛弃了，现在 CSS3 版本又重新捡回来了。这说明 text-shadow 这个属性非常值得我们做前端的人员重视，而且  CSS3 这么多属性中，我个人觉得 text-shadow运用得是最多的一个属性，作为我们前端人员我觉得有必要学习并掌握这个 text-shadow 属性。

text-shadow ： none |  none | [, ] *  或none |  [,  ]*

也就是：

text-shadow:[颜色(Color)  x轴(X Offset) y轴(Y Offset) 模糊半径(Blur)],[颜色(color) x轴(X Offset) y轴(Y Offset) 模糊半径(Blur)]...

或者

text-shadow:[x轴(X Offset) y轴(Y Offset)  模糊半径(Blur)  颜色(Color)],[x轴(X Offset) y轴(Y Offset)  模糊半径(Blur)  颜色(Color)]...

text-shadow