我有一个1920×100的图像插入我的页面顶部：
<img src="./Resources/Images/banner.jpeg" style="position:absolute; top:0px; left:0px; height:100px; width:100%;" 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;
}
