Question

我在这里遇到麻烦。我有一个1024x960的背景图像，我希望它适合所有类型的分辨率，但令人印象深刻的是，它在所有屏幕上都过度扩展。

这是我的CSS：

body {
    background-image: url("../testes/jogo.bmp");
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    background-color: #464646;
}

我猜这个代码有一个错误，但是每次我读它都觉得没关系，但显然不是。

Answer 1

试试这个：

body { 
  background: url('../images/background.jpg') no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

Answer 2

哼哼docs：

封面：将背景图像缩放到尽可能大，以使背景区域完全被背景图像覆盖。背景图像的某些部分可能不在背景定位区域中的视野中

如果您希望图像完全在视图中，可以使用

background-size:contain;

包含：将图像缩放到最大尺寸，使其宽度和高度都适合内容区域

Answer 3

body {
background-image: url("../testes/jogo.bmp")  no-repeat center center fixed;
background-size:cover;
}

you can see here

Answer 4

试用此代码：

＆＃13;

body {
background-image: url("http://miriadna.com/desctopwalls/images/max/Natural-dam.jpg");
background-position: center center;
background-repeat: no-repeat;
background-attachment: fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

＆＃13;

CSS图像不适合屏幕

4 个答案: