gpt4 book ai didi

html - 每当浏览器窗口变窄时,我应该使用什么代码来自动调整图像大小?

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

从空白屏幕开始,假设我有以下 HTML 代码:

<body>

<div id="image">
<img src="pic.jpg">
</div>

</body>

CSS 为:

#image{
width:100%;
height:auto;
}

#image img {
width:100%;
height:auto;
}

我在这里很困惑,因为图像没有变化,因为图像 div 具有图像的大小(图像尺寸为 1920*1080 像素),并且其 100% 是整个图像本身。但是如果我将宽度设置为 50%,仍然没有变化。

我只是想让图像根据浏览器调整大小,我的屏幕分辨率是 1366*768,所以最初我需要图像适合它,当我调整浏览器大小时,我需要图像的大小相应地改变。

最佳答案

设置包含的 div 的大小不会改变图像的大小。改为在图像上设置样式:

#image img {
width:100%;
height:auto;
}

演示:http://jsfiddle.net/jcJtM/

关于html - 每当浏览器窗口变窄时,我应该使用什么代码来自动调整图像大小?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19338998/

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