gpt4 book ai didi

css - 使用按比例缩放的图像完全覆盖容器

转载 作者:太空宇宙 更新时间:2023-11-03 20:48:06 25 4
gpt4 key购买 nike

我想按照以下规则使用 CSS 缩放图像:

if (containerWidth/containerHeight >=imgWidth/imgHeight) --> img { width: 100% }
if (containerWidth/containerHeight < imgWidth/imgHeight) --> img { height: 100% }

想法是使用 CSS(不使用 javascript)按比例缩放的图像完全覆盖容器。

期望的结果:http://jsfiddle.net/pu76s/6/

最佳答案

使用具有 CSS3 属性 background-size: cover 的背景图片

http://jsfiddle.net/UUhVf/

您可以使用background-position 属性调整位置

关于css - 使用按比例缩放的图像完全覆盖容器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18679733/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com