老师我没有悬停效果怎么回事？

来源：2-7 编程练习

原来是晓琪_

2019-05-03 17:30:27

<!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://climg.mukewang.com/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://climg.mukewang.com/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>