background-position-x - CSS(层叠样式表) 编辑
概要
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.
更多
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论