background 笔记1

1.background-size:auto || || ||cover ||cantain

cover: 放大铺满,但会使图片失真
contain:保持北京图片本身的比例,将图片缩放至宽或者高正好适应所定义北京容器区域

支持 IE9+ Firefox3.6+ chrome 4.0+ oprea 10+ sarfri 3+

2.background-break:bounding-box || each-box || continuous 内联元素背景图片平铺循环方式
*仅firefox支持

*在css3 有多图片的设置,但是需要注意的是“background-color”只能设置一个值,设置多个是致命的语法错误

css3多背景有层次之分,叠放的顺序为从上往下指定,即最先声明的背景在最上层

3.background-origin:指定背景图片的起点
参数:旧 padding border center
新 padding-box border-box center
浏览器默认:padding-box

padding-box:从padding外线开始
border-box:从border外线开始
center:从center外线开始,也就是padding内线开始

4.background-clip 控制背景展示区域,取值去background-origin 一致

注意:background-attachment 取值为 fixed时,一般运用在html或者body标签上才有背景固定效果,且如果设定为“fixed”,background-origin不起作用

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值