背景粘附

background-attachment 属性控制滚动元素内的背景图片是否随元素滚动而移动。这
个属性的默认值是 scroll ,即背景图片随元素移动。如果把它的值改为 fixed ,那么
背景图片不会随元素滚动而移动。
background-attachment:fixed 最常用于给 body 元素中心位置添加淡色水印,让水印

不随页面滚动而移动。


实现这种效果的 CSS规则如下。
body {
background-image:url(images/watermark.png);
background-position:center;
background-color:#fff;
background-repeat:no-repeat;
background-size:contain;
background-attachment:fixed;
}
没错,关于背景图片的规则写起来有点费劲,因为属性名太长了。别担心,使用简
写属性 background 就可以在一条声明里设置所有值。


简写背景属性
background 属性可以用来设定所有背景相关的值。比如,前面那个 background-
attachment 的例子使用简写的 background 属性,可以写成这样一条规则:
body {background:url(images/watermark.png) center #fff no-repeat contain fixed;}
声明中少写了哪个属性的值(比如没写 no-repeat ) ,就会使用相应属性的默认值
( repeat ) 。

转载于:https://my.oschina.net/u/1045177/blog/519065

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值