background-position
时间: 2023-09-03 16:15:44 浏览: 79
BackgroundPosition
The CSS property `background-position` sets the starting position of a background image. It determines where the top left corner of the image will be placed in relation to the element's padding box. The property takes two values, which can be either keywords or lengths that represent the horizontal and vertical positions of the background image.
The syntax for `background-position` is:
```
background-position: <horizontal-value> <vertical-value>;
```
The available horizontal values are:
- left
- center
- right
- length (e.g. 10px)
The available vertical values are:
- top
- center
- bottom
- length (e.g. 20%)
Using `background-position` with a single value will set the horizontal position to that value and the vertical position to the default value of `center`.
```
background-position: center;
```
You can also use percentages as values, which represent the position as a percentage of the element's width or height.
```
background-position: 50% 25%;
```
Negative values are also allowed, which will move the background image in the opposite direction.
```
background-position: -10px -20%;
```
阅读全文