#background-size
Defines the size of the background image.
默认属性
background-size: auto auto;
The background image will retain its original size.
For example, this background image is 960px by 640px large. Its aspect ratio is 3 by 2. It's bigger than its container (which is 150px high) and will thus be clipped.
background-size: 120px 80px;
You can specify a size in pixels:
- the first value is the horizontal size
- the second is the vertical size
background-size: 100% 50%;
You can use percentage values as well. Beware that this can alter the aspect ratio of the background image, and lead to unexpected results.
background-size: contain;
The keyword contain
will resize the background image to make sure it remains fully visible.
background-size: cover;
The keyword cover
will resize the background image to make sure the element is fully covered.