background-position-x
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
概要
background-position-x
CSS 属性设置水平方向的位置,与每个背景图片等位置层设置属性 background-origin
相关。更多信息请查看background-position
属性,这个用的比较普遍。
备注:这个属性的值会被后面声明的属性覆盖掉,如background
和background-position
等简写的属性。
初始值 | 0% |
---|---|
适用元素 | 所有元素. It also applies to ::first-letter and ::first-line . |
是否是继承属性 | 否 |
Percentages | refer to width of background positioning area minus width of background image |
计算值 | A list, each item consisting of: an offset given as a combination of an absolute length and a percentage, plus an origin keyword |
动画类型 | a repeatable list |
语法
css
/* Keyword values */
background-position-x: left;
background-position-x: center;
background-position-x: right;
/* <percentage> values */
background-position-x: 25%;
/* <length> values */
background-position-x: 0px;
background-position-x: 1cm;
background-position-x: 8em;
/* side-relative values */
background-position-x: right 3px;
background-position-x: left 25%;
/* Multiple values */
background-position-x: 0px, center;
/* Global values */
background-position-x: inherit;
background-position-x: initial;
background-position-x: unset;
值
left
-
在位置层上相对于左边的位置。
center
-
在位置层上相对于中间点的位置。
right
-
在位置层上相对于右边的位置。
<length>
-
<length>
值是定义相对于位置层边缘的距离,边缘默认为左边。 <percentage>
-
<percentage>
值是定义相对于位置层边缘的距离百分比,边缘默认为左边。
正规语法
规范
Specification |
---|
CSS Backgrounds and Borders Module Level 4 # background-position-longhands |
浏览器兼容性
BCD tables only load in the browser