概要
background-position-x CSS 属性设置水平方向的位置，与每个背景图片等位置层设置属性 background-origin相关。更多信息请查看background-position属性，这个用的比较普遍。
注意：这个属性的值会被后面声明的属性覆盖掉，如
background和background-position等简写的属性。| 初始值 | left |
|---|---|
| 适用元素 | all elements |
| 是否是继承属性 | 否 |
| Percentages | refer to width of background positioning area minus height 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 |
| Animation type | discrete |
语法
/* 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>值是定义相对于位置层边缘的距离百分比，边缘默认为左边。
正规语法
[ center | [ [ left | right | x-start | x-end ]? <length-percentage>? ]! ]#where
<length-percentage> = <length> | <percentage>
说明
| Specification | Status | Comment |
|---|---|---|
| CSS Backgrounds and Borders Module Level 4 background-position-x |
Editor's Draft | Initial specification of longhand sub properties of background-position to match longstanding implementations. |
兼容性
The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
No compatibility data found. Please contribute data for "css/properties/background-position-x" (depth: background-position-x) to the MDN compatibility data repository.