CSS 属性:background-position
背景图像的位置(如果是平铺的,则是起始位置)。

background-position: top right 结合 background-repeat: no-repeat。可能的值
可以包含一个值,或者更常见的是两个值。
| 值 | 描述 | 示例 |
|---|---|---|
| [length] | 图像的左侧或顶部侧边点,从背景区域的左侧或顶部测量。 | 50px |
| [percentage] | 从背景区域的左侧或顶部测量,其中 0% 将图像推到起始点,100% 将图像推到背景区域的整个宽度或高度的结束点。 | 25% |
center | 关键字。如果单独使用,等同于 50% 50%。 | |
top | 关键字。如果单独使用,等同于 50% 0%。 | |
right | 关键字。如果单独使用,等同于 100% 50%。 | |
bottom | 关键字。如果单独使用,等同于 50% 100%。 | |
left | 关键字。如果单独使用,等同于 0% 50%。 | |
| [值] [值] | 两个长度/百分比值或两个关键字的任何合理组合。 如果值为长度或百分比,第一个是水平位置,第二个是垂直位置。 | 200px 100px |
| [值] [值] [值] | 偏移量。
| top 10em right |
| [值] [值] [值] [值] | 偏移量。
| top 10em right 5em |
[值], [值] | 用于多个背景。用逗号分隔的值集对应于用逗号分隔的多个图像,与 background-image 对应。 | top right, 11px 22px |
inherit | ||
initial | ||
unset | ||
示例
.dimple { background-position: right bottom; }
/* Places a background image in the bottom-right corner of a box. */
.bump { background-position: top 30px left 2px; }
/* Background is 30 pixels down from the top and 2 pixels in from the left. */
