gpt4 book ai didi

css - 使用 CSS 缩放图像

转载 作者:技术小花猫 更新时间:2023-10-29 10:35:25 33 4
gpt4 key购买 nike

我现在其实不需要它,只是出于好奇......

假设我们有一个流畅的网站布局,可以在 1920 像素的显示器和小型智能手机上完美运行。现在假设我们在那里有图像,显然(显然?)我们想要缩放它们。我们已经在服务器上上传了 2560 像素的图像(因为现在谁关心带宽)并将 width: 100% 属性设置为 img 标签。

所以我们有两个用户:一个是 1920px 显示屏的程序员,我们称他为 Jo,另一个是智能手机的女学生,我们称她为 Nancy(因为有了 Nancy 一切都更好,对吧?)。

Jo 和 Nancy 很高兴,因为我们使用 width: 100% 缩放图像的计划可行,但是如果我们决定也显示小图像,比如 400px 宽度呢? Nancy 不会注意到任何事情,但对 Jo 来说,这将是一场灾难。

所以问题是:我们能否在不使用 JavaScript 的情况下让 Jo 和 Nancy 开心?

最佳答案

为什么不选择 max-width: 100% 呢?

这将保留所有小于屏幕宽度的图像,而比屏幕宽的图像也将调整为 100%。问题解决了,大家开心!

关于css - 使用 CSS 缩放图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8790730/

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