老师我没有悬停效果怎么回事?
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>background-origin</title>
<style type="text/css">
*{margin: 0;padding: 0;border: 0;}
div{
width: 300px;
height: 150px;
padding: 20px;
border:20px solid transparent;
background: url("http://img1.sycdn.imooc.com/climg//582c342b0001fd6507000210.jpg") no-repeat;
background-clip: padding-box;
}
.div_border{
width: 300px;
height: 150px;
padding: 20px;
border:20px solid rgba(0,0,255,.25);
position: absolute;
left: 0;
top: 0;
}
.div_padding{
width: 300px;
height: 150px;
border:20px solid transparent;
position: absolute;
left: 20px;
top: 20px;
}
div:hover{
background: url("http://img1.sycdn.imooc.com/climg//582c34220001091605000150.jpg") no-repeat 10px 10px;
background-clip: border-box;
background-origin: content-box;
}
</style>
</head>
<body>
<div></div>
<span class="div_border"></span>
<span class="div_padding"></span>
</body>
</html>


恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星