用法
• box-shadow:[inset]x y blur [spread] color
• 参数
inset:投影方式
inset:内投影
<style>
.box{width:100px;height:100px;margin:100px;background:Red;box-shadow:inset 10px 10px 30px blue;}
</style>
</head>
<body>
<divclass="box"></div>
</body>
不给:外投影
<style>
.box{width:100px;height:100px;margin:100px;background:Red;box-shadow:10px 10px 30px blue;}
</style>
</head>
<body>
<div class="box"></div>
</body>
– x、y:阴影偏移
– blur:模糊半径
– spread:扩展阴影半径
先扩展原有形状,再开始画阴影
<style>
.box{width:100px;height:100px;margin:100px;background:Red;box-shadow:0 0 30px 30px #000,inset 0 0 30px yellow;}
</style>
</head>
<body>
<divclass="box"></div>
</body>