盒子陰影樣式單詞：box-shadow 語法 <style> div{box-shadow:0 0 1px #000 inset;} </style> 其中，第一個和第二個0分別代表邊框間距靠左和靠上；1px表示陰影範圍；#000表示陰影顏色為黑色；inset 代表框內陰影 ，沒有inset 則代表 ...
盒子陰影樣式單詞：box-shadow
語法
<style>
div{box-shadow:0 0 1px #000 inset;}
</style>
其中，第一個和第二個0分別代表邊框間距靠左和靠上；1px表示陰影範圍；#000表示陰影顏色為黑色；inset 代表框內陰影 ，沒有inset 則代表框外陰影。
需要註意的是：
box-shadow:0px 0px 1px #000
當第1個值為0時，代表左右邊框陰影 為1px範圍
第1個值為正整數 代表 左邊框陰影
第1個值為負整數 代表 右邊框陰影
同理
當第2個值為0 代表上下邊框陰影
第2個值為正整數 代表1px陰影距離上邊框多少
第1個值為負整數 代表下邊框陰影設置
div style分別對div盒子和圖片設置內陰影和外陰影為案例。
①案例HTML代碼：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<title>對象陰影 線上演示 DIVCSS5 VIP</title>
<style>...</style>
</head>
<body>
<div>盒子對象陰影測試</div>
<div class="box">DIV盒子內陰影</div>
<div>圖片對象陰影測試</div>
<div class="box2"><img src="151209173849244246.jpg" /></div>
</body>
</html>
②案例style代碼：
.box {box-shadow:5px 2px 6px #000 inset;width:300px; height:80px;}
.box2 img {box-shadow:5px 2px 6px #000 }
分別設置div對象內陰影效果和圖片外陰影效果
實現效果：
