1.背景的基本属性
background-color
backgroud-image:none | url()
backgroud-repeat:no-repeat | repeat-x | repeat-y | repeat
background-attachment:scroll | fixed(设置背景图片是否固定或者随着页面的其余部分滚动)
background-position:% || length(设置背景图片的位置)
eg:background-position:top center;(背景图片的顶边中心点和元素的顶边中心吻合)
2.css3中增加的属性
(加前缀)backgound-origin:padding-box | borde-box((默认值) | content-box
eg:padding:10px;border:10px
border-box效果:
padding-box效果:
content-box效果:
backgroud-clip:取值同kgound-origin(表示裁剪背景图片)
border-box:裁剪范围在边框以内
padding-box:裁剪范围在内距以内
content-box:裁剪范围在内容以内
text:剪的图片用来填充文字
backgound-size:auto(图片本身的大小) | 宽度 高度 | cover(背景图片按比例放大来填充容器) | contain(图片缩小到宽度或者高度正好适应容器的宽度或者高度)
backgroudz支持多背景(一一对应,其他属性类似):
eg: