MDN wants to learn about developers like you: https://qsurvey.mozilla.com/s3/MDN-dev-survey

background-position-x

概要

background-position-x CSS 属性设置水平方向的位置,与每个背景图片等位置层设置属性 background-origin相关。更多信息请查看background-position属性,这个用的比较普遍。

注意:这个属性的值会被后面声明的属性覆盖掉,如backgroundbackground-position等简写的属性。

初始值left
适用元素all elements
是否是继承属性
Percentagesrefer to width of background positioning area minus height of background image
适用媒体visual
计算值A list, each item consisting of: an offset given as a combination of an absolute length and a percentage, plus an origin keyword
Animation typediscrete
正规顺序the unique non-ambiguous order defined by the formal grammar

语法

/* 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.

兼容性

No compatibility data found. Please contribute data for "css/properties/background-position-x" to the MDN compatibility data repository.

更多

文档标签和贡献者

 此页面的贡献者: maicss
 最后编辑者: maicss,