在编写nav时因为原声图标的PNG图片过大,于是选用scale属性进行缩放,可是后来发现缩放后依然占有原来图片的位置。
<div class="container">
<img src="./home-1.png">
<span>AAAAAAAAAAAAAAAAAAAA</span>
</div>
图片1
图片原大小为201200,父盒子大小是200200
图片2
使用 {transform : scale(0.5)} 后,图片查看大小是100.5*100
但是可以看出子元素span依然被挤出父盒子,图片依然占有原图片大小的位置。
图片3
使用 { zoom:0.5 } 后,查看图片大小依然是201*200,但是显示大小已经缩小了一半。子元素可以在盒子中显示
对于正方图片也可以使用设置宽高来限制显示大小
网友评论