图片正常效果
图片变形效果
一、flex-shrink: 0
给 img 设置 flex-shrink: 0;
flex-shrink 的默认值为1，如果没有显示定义该属性，将会自动按照默认值1在所有因子相加之后计算比率来进行空间收缩。设置为0表示不收缩。
flex 元素仅在默认宽度之和大于容器的时候才会发生收缩，其收缩的大小是依据 flex-shrink 的值。注意：如果元素不是弹性盒对象的元素，则 flex-shrink 属性不起作用。
缺点：仅兼容IE11
二、height: 100%
在父元素没有设置高度的情况下，给图片设置 height: 100%;
三、外层div标签包裹
用div标签包裹图片，这种方案比较通用，缺点：产生无用标签。
作者：立正小歪牙
链接：https://www.jianshu.com/p/d71f6e9d3236
来自 “ ITPUB博客 ” ，链接：https://blog.itpub.net/861/viewspace-2816469/ ，如需转载，请注明出处，否则将追究法律责任。
上一篇：
企业级Nginx实战
请登录后发表评论
登录
全部评论
