基礎(chǔ)說明：
** 外陰影：**box-shadow: X軸 Y軸 Rpx color;
** 屬性說明（順序依次對應(yīng)）： **陰影的X軸(可以使用負值) 陰影的Y軸(可以使用負值) 陰影模糊值（大邢の病） 陰影的顏色
** 內(nèi)陰影：**box-shadow: X軸 Y軸 Rpx color inset;
默認是外陰影 內(nèi)陰影：inset 可以設(shè)置成內(nèi)部陰影
** 注（PS）：此屬性使用于盒模型 如(div,p,h1,h2,h3,h4,h5,h6等) 不是用來設(shè)置文字陰影 如果設(shè)置文字陰影請參考知識點:text-shadow**（同理）
因為是新屬性，為了兼容各主流瀏覽器并支持這些主瀏覽器的較低版本愕难，基于主流瀏覽器上使用box-shadow屬性時惫霸，我們需要將屬性的名稱寫成-webkit-box-shadow的形式。Firefox瀏覽器則需要寫成-moz-box-shadow的形式
歐朋瀏覽器 -o-box-shadow IE>9 -ms-box-shadow
基礎(chǔ)練習(xí)：
為了更好的了解box-shadow的特征猜丹，做幾個小測試：(為了方便直接在標簽內(nèi)嵌套樣式)
測試1： <div style="box-shadow: 0 0 10px #f00; border:1px solid green"></div> box-shadow: 0 0 10px #f00 （因沒有使其X軸與Y軸移動 設(shè)置值 所在會在本身發(fā)生作用 半徑范圍硅卢，顏色）
測試2： <div style="box-shadow:4px 4px 10px #f00; border:1px solid green"></div> box-shadow:4px 4px 10px #f00;與測試1不同 X軸與Y軸改變了正值（正值 向右 向下） 所以變成了這樣
測試3：<div style="box-shadow:-4px -4px 10px #f00; border:1px solid green"></div> box-shadow:-4px -4px 10px #f00;與測試2不同 之處是 X軸與Y軸改變成了負值（負值 向左 向上） 所以變成了這樣
同理：你可以測試下一正值脉顿，一負值的效果点寥，這里就不做測試了。蔽莱。。盗冷。正塌。。乓诽。。
測試4：<div style="box-shadow:-10px 0px 10px red, /左邊陰影/
0px -10px 10px #000, /上邊陰影/
10px 0px 10px green, /右邊陰影/
0px 10px 10px blue;" /下邊陰影/ ></div>
你看到這樣的代碼會感覺很亂 但是看到效果圖片之后你就能明白這是怎么做的了無非改一下X軸與Y軸位置與顏色值 還有陰影值大小讼育，（用逗號隔開）多練習(xí)幾次就好
測試5：--**內(nèi)陰影 **<div style="box-shadow: 0px 0px 10px red inset; border:1px solid green"></div> box-shadow: 0px 0px 10px red inset; 與上面寫法相同 唯一不同的是添加了一個inset 其它屬性與外陰影相同
百變不離其宗奶段，練習(xí)就能熟悉剥纷，懂了就知道原理,隨意改寫晦鞋，在配合css3的動畫效果， 閃光層（字）都很簡單實現(xiàn)悠垛。确买。希望對你有幫助。湾趾。
