18 边框阴影动画

当鼠标穿过展示动画效果

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>边框阴影</title>
	<style type="text/css">
		.shadow{
			margin: 50px auto;
			position: relative;
			width: 200px;
			height: 200px;
			background-color: purple;
			box-shadow: 20px 20px 50px red;
		}
		.shadow:hover{
			top: -3px;
			box-shadow: 0 15px 10px #e0e0ee0;
		}
	</style>
</head>
<body>
	<div class="shadow"></div>

</body>
</html>
posted @ 2022-08-05 11:18  角角边  Views(35)  Comments(0)    收藏  举报