盒子阴影

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>盒子阴影</title>
<style type="text/css">
.box {
width: 200px;
height: 200px;
background-color: red;
margin: 350px auto;
/*盒子阴影*/
/*x轴偏移 y轴偏移 虚化长度 阴影宽度 阴影颜色*/
/*多个值之间用,隔开*/
box-shadow: -310px 0 30px 0px yellow, 310px 0 30px -10px green, 0 -310px 30px -10px orange, 0 310px 30px -10px blue;
}
</style>
</head>
<body>
<div class="box"></div>
</body>
</html>

posted @ 2018-09-28 15:10  不沉之月  阅读(104)  评论(0编辑  收藏  举报