CSS 给网页添加全屏背景图片，兼容不同浏览器窗口大小（自适应缩放）

使用 background 属性来设置背景图片，并控制它的显示方式：

html {
    background: url('images/bg.jpg') no-repeat center center fixed;
}

各参数详细解释：

• url(‘images/bg.jpg’)：设置背景图片路径。

• no-repeat：防止背景图片重复显示。

• center center：使图片居中显示。

• fixed：使背景图片固定（网页滚动时背景不动）。

实现全屏覆盖

为了让背景图片始终覆盖整个页面，无论浏览器窗口大小如何变化，需要使用 background-size: cover。这个属性确保背景图片根据窗口尺寸进行缩放，保持图片的比例，不会被拉伸或压缩变形：

html {
    background-size: cover;
}

兼容旧版浏览器

html {
    -webkit-background-size: cover; /* 兼容旧版 Safari */
    -moz-background-size: cover;    /* 兼容旧版 Firefox */
    -o-background-size: cover;      /* 兼容旧版 Opera */
}

完整代码

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