width与高之间自动适应

 
 

  
  div {

 
 
 
 
          
  
  width: 
  
  100%;

 
 
 
 
          
  
  position: relative;

 
 
 
 
          
  
  &
  
  ::after {

 
 
 
 
            
  
  content: 
  
  '';

 
 
 
 
            
  
  display: block;

 
 
 
 
            
  
  padding-top: 
  
  100%;

 
 
 
 
            
  
  visibility: hidden;

 
 
 
 

  
            }

 
 
 
 
          
  
  img {

 
 
 
 
            
  
  position: absolute;

 
 
 
 
            
  
  top: 
  
  0;

 
 
 
 
            
  
  left: 
  
  0;

 
 
 
 

  
            }

 
 
 
 

  
          }
 
 
 
 


 
 
 
 

  
  padding用百分比做单位时是相对于容器的宽度来算的