©
This document usesPHP Chinese website manualRelease
background-position:
默认值:0% 0%,效果等同于left top
适用于:所有元素
继承性:无
动画性:是
计算值:指定值
用百分比指定背景图像填充的位置。可以为负值。其参考的尺寸为容器大小减去背景图片大小
用长度值指定背景图像填充的位置。可以为负值。
center:
背景图像横向和纵向居中。
left:
背景图像在横向上填充从左边开始。
right:
背景图像在横向上填充从右边开始。
top:
背景图像在纵向上填充从顶部开始。
bottom:
背景图像在纵向上填充从底部开始。
该属性提供2个参数值(CSS3中已允许提供3,4个值)。
如果提供三或四个,每个
示例:假设要定义背景图像在容器中右下方,并且距离右边和底部各有20px
缩写方式:
background:url(test1.jpg) no-repeat right 20px bottom 20px;
你也可以设置3个参数值:
拆分方式:
background:url(test1.jpg) no-repeat left bottom 10px;
要注意的是:设置3个或4个值,偏移量前必须有关键字。也就是说,形如:"10px bottom 20px" ,这样的参数设置是错误的,因为10px前面没有关键字。
如果提供两个,第一个用于横坐标,第二个用于纵坐标。
如果只提供一个,该值将用于横坐标;纵坐标将默认为50%(即center)。
对应的脚本特性为backgroundPosition。
浅绿= 支持
红色= 不支持
粉色= 部分支持
灰色= 未知
Values | IE | Firefox | Chrome | Safari | Opera | iOS Safari | Android Browser | Android Chrome | Android UC |
---|---|---|---|---|---|---|---|---|---|
Basic Support | 6.0+ | 2.0+ | 4.0+ | 3.1+ | 15.0+ | 3.2+ | 2.1+ | 18.0+ | 7.0+ |
3-4个参数 以边界作参考偏移 |
6.0-8.0 | 2.0-12.0 | 4.0-24.0 | 3.1-6.1 | 3.2-6.1 | 2.1-4.3 | 18.0-24.0 | 7.0-9.9 | |
9.0+ | 13.0+ | 25.0+ | 7.0+ | 7.0+ | 4.4+ | 25.0+ |