边框阴影"/>
css3边框阴影
利用box-shadow属性制作
语法 box-shadow: h-shadow v-shadow blur spread color inset;
h-shadow：水平阴影的位置，必需 v-shadow：垂直阴影的位置，必需
blur：模糊距离，可选 spread：阴影的尺寸，可选
color：阴影的颜色，可选 inset：将外部阴影 (outset) 改为内部阴影，可选
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>* {margin: 0;padding: 0;}.sky {position: relative;width: 500px;height: 600px;margin: 0 auto;background-color: skyblue;}.cloud {position: absolute;top: 220px;left: 80px;width: 80px;height: 80px;border-radius: 50%;background-color: #fff;box-shadow: 40px -40px 0 10px #fff,50px 4px 0 2px #fff,95px -4px 0 -2px #fff;}</style>
</head>
<body><div class="sky"><div class="cloud"></div></div>
</body>
</html>更多推荐
css3边框阴影
发布评论