The effect of background-size on background-position

The Background-size property is presented in CSS3, which sets the size of the background picture, which has no effect on background-position when the value of the property is set to an absolute value or as a percentage, which affects when set to Contain/cover. , and one of the values is invalid.

Background-size:contain This property will make the background image width or height fit the parent element, and if scaled, the background image will never exceed the parent element

Background-size:cover This property fills the background picture with the parent element, and if scaled, the background image may go beyond the parent element

The top value of position is invalid when the width of the picture is greater than the height

The left value of position is invalid when the width of the picture is less than the height

The effect of background-size on background-position