Question

我使用CSS代码为我的网站创建了一个背景，但是问题是我在不同的屏幕上运行它无论是大还是小我都没有得到类似的结果。当我在13 inch screen上运行浏览器缩放时，我获得的格式可能与18 inch中的格式不一样，显然它不具有确切的形式但是或多或少我需要它看起来像。有什么建议？ thnx提前

body {
background-image: url(../images/background.jpg);
background-repeat: no-repeat;
    }

我现在的另一个问题是背景不是全屏的。它的分辨率是1920x1080，虽然我可以在整个网页浏览器页面上看到图片，但我仍然看不到照片的其他细节。

Answer 1

我认为你需要

background-size: cover;

有一些浏览器不一致，这可能意味着使用jquery插件会更好。

查看http://srobbin.com/jquery-plugins/backstretch/它允许您使用根据屏幕大小调整大小的背景图像。它还涉及IE。努夫说。

另请参阅http://css-tricks.com/perfect-full-page-background-image/

我不是100％想要实现的目标，但上述链接值得一看。

这是css3方式

html { 
    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;
}

适合不同屏幕的背景

1 个答案: