Background-size: set the size of the background image,

Background-size: set the size of the background image,
Background-size

Set the size of the background imageLength ValueOrPercentageDisplay, you can also useCoverAndContainTo scale the image.

Syntax:

Background-size: auto | <length >|< percentage> | cover | contain

Value description:

1. auto: Default value. The original height and width of the background image are not changed;

2. <length value>: For example, 200px 50px is displayed in pairs. Set the width and height of the background image to the first two values. When you set a value, use it as the image width value.Proportional Scaling;

3. <percentage>: 0% ~ For any value between 100%, set the width and height of the background image to the value obtained by multiplying the width and height of the element with the preceding percentage. The value is the same as that when setting a value;

4. cover: As the name impliesOverwriteTo scale the background image to an equal ratioFill the entire container;

5. contain: To accommodate, scale the background image to an equal ratioOne side is close to the container edge..

Tip:You can enter your code in the edit window on the right to try different values.

 

<! DOCTYPE html>