前端之家收集整理的这篇文章主要介绍了
html – Object-fit：cover;替代？，
前端之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。
我在我的
页面上有一个图像,我想保持比例,但调整大小根据屏幕大小.我想要这样做,使得较小的宽度和高度被精确地适合元素,并且较大的维度溢出元素.
我找到了
object-fit: cover;
风格符合我的需求,但很快就发现,对此的支持非常有限(几乎只有歌剧).还有什么我可以用来实现这一点吗？
提前谢谢了 ：)
如果您可以将此图像作为背景
添加到
页面,则可以使用：
background-size: cover;
此属性也可以接受包含值.尝试一下,你会看到差异.
盖子强制图像填满整个容器.这意味着如果图像的比例与容器的比例不匹配,则会裁剪图像.
包含迫使图像适合容器.这意味着图像永远不会超出容器的边界.如果比例(图像和容器)不同,则图像侧面将留有空格(左和右或顶部和底部).
覆盖和包含值被相应支持：
Chrome Firefox IE Opera Safari
3.0 3.6 9.0 10.0 4.1
原文链接：https://www.f2er.com/html/229500.html
