Question

这是demo。我想在没有拉伸的情况下完全适合背景图像。因为当我调整窗口图像时会扭曲。如果我用

更改css

position: absolute;
width: 100%;
height: 100%;
background: url("http://farm9.staticflickr.com/8100/8601158004_173413335e_k.jpg");
background-repeat:no-repeat;

图像不再拉伸，但图像将非常大。如何正确设置背景图像？我会感谢任何帮助。

Answer 1

您可以使用background-size - 属性 cover ：

#homee {
    position: absolute;
    width: 100%;
    height: 100%;
    background: url("http://farm9.staticflickr.com/8100/8601158004_173413335e_k.jpg");
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat;
}

http://jsfiddle.net/G2Rhq/4/

<强>更新

如果您要支持oldIE，请尝试使用我的超简单jquery插件：

https://github.com/yckart/jquery.fitpic.js

完全拟合背景图像，无需扩展

1 个答案: