代码实例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
body
{
background:url("/uploads/allimg/20221223/1-221223161543561.png");
background-repeat:no-repeat;
background-attachment: fixed
}
</style>
</head>
<body>
<p>背景图像是固定的， 试着向下滚动页面。</p>
<p>背景图像是固定的， 试着向下滚动页面。</p>
<p>背景图像是固定的， 试着向下滚动页面。</p>
<p>背景图像是固定的， 试着向下滚动页面。</p>
<p>背景图像是固定的， 试着向下滚动页面。</p>
<p>背景图像是固定的， 试着向下滚动页面。</p>
<p>背景图像是固定的， 试着向下滚动页面。</p>
<p>背景图像是固定的， 试着向下滚动页面。</p>
<p>背景图像是固定的， 试着向下滚动页面。</p>
<p>背景图像是固定的， 试着向下滚动页面。</p>
<p>背景图像是固定的， 试着向下滚动页面。</p>
<p>背景图像是固定的， 试着向下滚动页面。</p>
<p>背景图像是固定的， 试着向下滚动页面。</p>
<p>背景图像是固定的， 试着向下滚动页面。</p>
<p>背景图像是固定的， 试着向下滚动页面。</p>
<p>背景图像是固定的， 试着向下滚动页面。</p>
<p>背景图像是固定的， 试着向下滚动页面。</p>
<p>背景图像是固定的， 试着向下滚动页面。</p>
<p>背景图像是固定的， 试着向下滚动页面。</p>
<p>背景图像是固定的， 试着向下滚动页面。</p>
</body>
</html> 尝试一下 »
点击“尝试一下”按钮查看在线实例
定义和用法
background-attachment设置背景图像是否固定或者随着页面的其余部分滚动。
属性值
| 值 | 说明 |
|---|---|
| scroll | 背景图片随页面的其余部分滚动。这是默认 |
| fixed | 背景图像是固定的 |
| inherit | 指定background-attachment的设置应该从父元素继承 |
| local | 背景图片随滚动元素滚动 |
