image.png

    1.     <style>
    2.         div {
    3.             position: relative;
    4.             width: 300px;
    5.             height: 300px;
    6.             margin: 200px auto;
    7.             border: 1px solid #bfbfbf;
    8.             background-color: burlywood;
    9.             overflow: hidden;
    10.         }
    12.         div::after {
    13.             display: block;
    14.             content: '';
    15.             width: 100%;
    16.             height: 100%;
    17.             background-image: url(../css练习/images/she.jpg);
    18.             background-size: 300px;
    19.             transform-origin: bottom left;
    20.             transform: rotate(90deg);
    21.             background-color: paleturquoise;
    22.             transition: all 0.5s;
    23.         }
    25.         div:hover::after {
    26.             transform: rotate(0deg);
    27.         }
    28.     </style>
    29. </head>
    31. <body>
    32.     <div></div>
    33. </body>