HTML Dog
跳至导航

CSS 属性:background-attachment

指定背景是固定在视口还是随着其包含框的内容一起滚动。

例如,应用到长页面的背景图像通常会随着页面的其余部分一起滚动。但是,如果应用了固定的 background-attachment,图像将保持在同一位置,而用户上下滚动页面。

可能的值

描述示例
scroll背景附加到元素框。它将随着元素框一起滚动(因此通常会随着页面一起滚动)。默认行为。
fixed背景附加到视口。它将在页面滚动时保持静止。
local背景附加到框内容。它将随着内容一起滚动(除非框有自己的滚动机制,例如通过 overflow,否则将等同于 scroll)。
[值], [值]用于多重背景。用逗号分隔的值对应于使用 background-image 分隔的多个图片。scroll, fixed
inherit

示例


body { background-attachment: fixed; }
/* The background will remain stationary when the page's contents are scrolled through. */

浏览器支持

我可以使用 background-attachment 吗? 来自 caniuse.com 的关于 background-attachment 功能在主流浏览器中支持的数据。