CSS3 实现内外阴影效果 

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>box-shadow</title>
	<style type="text/css">
		.box{
			width: 100px;
			height: 100px;
			border:10px solid #fff;
			border-radius: 10px;
			background-color: #fff;
			-webkit-box-shadow: 0 0 10px red inset, 0 0 10px blue;
			-moz-box-shadow: 0 0 10px red inset, 0 0 10px blue;
			-o-box-shadow: 0 0 10px red inset, 0 0 10px blue;
			box-shadow: 0 0 10px red inset, 0 0 10px blue;
		}
	</style>
</head>
<body>
	<div class="box"></div>
</body>
</html>

 

posted @ 2018-11-21 18:58  格鲁特baby  阅读(244)  评论(0)    收藏  举报