<html><head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
div{
width: 290px;
height: 240px;
margin: 30px;
/*水平 垂直 阴影的模糊程度 颜色*/
box-shadow: 10px 10px 50px black;
border-image:url("img/7.jpg") 50 50 round;
}
.one{
background: rgba(255,0,0, 1.0);
}
.two{
background: rgba(255,0,0, 0.8);
}
.three{
background: rgba(255,0,0, 0.6);
}
.four{
background: rgba(255,0,0, 0.4);
}
.five{
background: rgba(255,0,0, 0.2);
}
p{
width: 400px;
height: 150px;
font-size: 60px;
color: red;
text-shadow: 2px 2px 5px black;
}
span{
display: inline-block;
width: 200px;
height: 100px;
background: red;
}
span:hover{
-webkit-transform-origin: bottom center;
transform:scale(1.9);
}
</style>
</head>
<body>
<div class="one">1</div>
<div class="two">2</div>
<div class="three">3</div>
<div class="four">4</div>
<div class="five">5</div>
<p>殷婷婷</p>
<span>12121</span>
</body></html>