Question

我正在尝试创建一个完整的background网站。现在我正在使用1920*1080 resolution屏幕。但我必须适应任何分辨率的背景。我使用以下css

html {
    background:#65b5cc url(webbg.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
   -moz-background-size: cover;
    -o-background-size: cover;
     background-size: cover;
    }

但是，当浏览器重新调整大小时，这不会重新调整背景大小，而另一个疑问是我使用背景作为jpg图像大小为1627 * 768。是正确的大小。我想将矢量类型的图纸显示为我的背景，因此希望以更小的尺寸获得最大的质量。指导我。

由于

Answer 1

Use this property "background-size:100%"

Answer 2

试试这个：

html, body {
    background: url(http://placeskull.com/100/100/) no-repeat center center fixed #65b5cc;
    // Make sure your SVG image expands to the whole window/page.
    background-size: 100% 100%;
}

如果你使用SVG图像，它的实际尺寸并不重要，因为它是一个矢量文件，所以它可以缩放到任何尺寸而不会失去质量。

See Example

完整背景图像大小在浏览器中的任何分辨率

2 个答案: