html – 如何在CSS中水平调整页面时停止图像收缩

概述我有一个1920×100的图像插入我的页面顶部： <img src="./Resources/Images/banner.jpeg" style="position:absolute; top:0px; left:0px; height:100px; width:100%;" name="top"> 我想要这样做,以便当页面水平调整大小时,图像不会缩小页面,而是保持在屏幕的中心,如下所示： 这似乎 我有一个1920×100的图像插入我的页面顶部：

<img src="./Resources/Images/banner.jpeg"  name="top">

我想要这样做,以便当页面水平调整大小时,图像不会缩小页面,而是保持在屏幕的中心,如下所示：

这似乎是一件容易实现的简单的事情,但是我还没有找到解决方案.

我可以将图像放在div中,并将div的左侧位置设置为 – (1920-pageWIDth)/ 2,但这将依赖于JavaScript.我正在寻找一个更清洁的解决方案(如果有的话),只是为了最小化页面的复杂性,并最大限度地提高浏览器的兼容性.

有没有可以使用CSS属性来实现这一点,还是我完全错误的实现这个方法？

任何帮助赞赏.

解决方法 使用CSS

div {  background: url(./Resources/Images/banner.jpeg) no-repeat scroll center top transparent;  height: 100px;}

总结

以上是内存溢出为你收集整理的html – 如何在CSS中水平调整页面时停止图像收缩全部内容，希望文章能够帮你解决html – 如何在CSS中水平调整页面时停止图像收缩所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。