1

我正在尝试将背景图像设置为全屏,并且在窗口调整大小时图像不会改变实际像素大小,但会变小(类似于裁剪)

这就是我的意思:(尝试调整窗口大小并注意图片变小或变大但不像素化)http://jsfiddle.net/G7Qc4/

现在,由于图像是 div 的背景并且我设置了,因此上述工作正常:

background-position: center top;

如果它只是简单的<img>它不起作用,我的问题是我怎样才能让它起作用?如果有什么办法?

我正在使用不接受 div 的图像的 nivoSlider,所以我将不得不使用<img>.

非常感谢

4

2 回答 2

1

如果我理解,您想使用实际标签作为背景而不是背景图像。

这是我的解决方案:http: //jsfiddle.net/ttZeM/

它需要知道背景图像的尺寸。

有一个 div 持有绝对定位的背景,网站内容绝对定位在它上面。

为了使背景图像居中,我将它向左移动了 -500px,即宽度的一半。它位于 0px 宽的 div 内,以position:absolute; left:50%一种奇怪的技术居中,但如果您知道图像大小,它就可以工作。

还要注意 bg_wrap div 有溢出:隐藏;和宽度:100%;这意味着您不会在屏幕边缘看到滚动条。

我希望这就是你所追求的!

于 2011-09-10T17:32:57.943 回答
0

可以使用 CSS3 ( background-size: cover) 完成,如下所示:http: //jsfiddle.net/mqchen/Kq3pa/

于 2011-09-10T16:56:19.343 回答