<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>表白墙</title>
<style>
.a1{
margin:0;
padding-top:15px;
background-color: linen;
height:15px;
}/*登陆背景块*/
.a2{
z-index: 3;
float:right;
text-decoration:none;
color:black;
}/*登陆文字设置*/
.a3{
z-index: 2;
height:15px;
width:80px;
display:block;
border:1px;
solid:red;
float:right;
margin-right:15px;
}/*对登陆文字进行块状设置*/
body{
margin: 0;
background-image:url("壁纸.png");
background-repeat:no-repeat;
}
.snowfall-flakes:before,
.snowfall-flakes:after{
z-index: 1;
content:'';
position: absolute;/*绝对定位*/
left:0px;
top:0px;
width:10px;
height:16px;
background-color:red;
border-radius: 5px 5px 0px 0px;/*圆角属性 四个值顺时针控制四个角弧度*/
}
.snowfall-flakes:before{
transform: rotate(-45deg);/*旋转工具 0deg角度 左负右正*/
}
.snowfall-flakes:after{
transform:translateX(4.3px) rotate(+45deg);/*translateX自身水平移动*/
}
</style>
</head>
<body>
<div class="a1">
<div class="a2">
<div class="a3"><a href="../../www.baidu.com"></a></div>
</div>
<script src="jquery-3.3.1.min.js"></script>
<script src="snowfall.jquery.js"></script>
<script>
$(document).snowfall({flakeCount : 100, maxSpeed : 10});
</script>
</body>
</html>
