為了更好的了解box-shadow的特征，做幾個小測試：(為了方便直接在標(biāo)簽內(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)让网。呀忧。希望對你有幫助。溃睹。
