transform、transform实现图片拉近

源码

<!DOCTYPE html>  
<html>  
  
    <head>  
        <meta charset="UTF-8">  
        <title>transform、transform实现图片拉近</title>  
        <style>  
           
            .test_a {  
                display: block;
                margin: 0 auto;
                width:400px;
                overflow: hidden;
            }  
              
            .test_a img {  
                width: 100%;
            }  
              
            .test_a:hover img {  
                transform: scale(1.2);  
                transition: all 1s ease 0s;
            } 
            
             
        </style>  
    </head>  
  
    <body>  
        <a href="" class="test_a">
          <img src="1.jpg" />
        </a>  
    </body>  
  
</html>