如何在浏览器屏幕调整html大小时修复图像大小

时间:2013-10-04 18:18:56

标签: html image scroll resize responsive-design

我创建了一个html页面,里面只有一个div和一个图像。 我的问题是当我调整浏览器屏幕大小时,图像也会调整大小。我希望每当浏览器屏幕改变其宽度时都要做一些事情,例如,通过显示scroll-x来查看整个图像,图像保持相同的分辨率。

我可以通过做一些解决方法来做到这一点。请看下面的小提琴: http://jsfiddle.net/EB2cq/

<div style="width: 1424px; ">
  <img src="http://1.bp.blogspot.com/_duWYbLDtB5s/RxD10qnsOZI/AAAAAAAAACc/9nPZhQRAVZ4/S658/google_logo_halloween_d-(mip.jpg"/>
</div>

正如您所看到的,当浏览器屏幕改变其宽度时,我可以滚动图像。但在我的情况下,我不想看到div的宽度,因为我只想在真正需要时显示滚动条。

如果从上面的小提琴中删除div的宽度样式属性,行为就是我所期待的。只有当页面宽度小于图像宽度时,div才会获取滚动x。但是,在我的Web应用程序中,同样的事情不会发生。图像也会根据浏览器宽度调整大小。

我在这里可以缺少什么?我的网络应用程序中有完全相同的小提琴代码

我看了一下这个问题,但它没有那么多帮助: Get image to stay fixed even with window resize

1 个答案:

答案 0 :(得分:0)

您是否检查了父元素的样式。这可能是个问题。