How to modify the background image width and height with css

How to modify the width and height of the background image in css: first create an HTML sample file; then use the "background-image" attribute to set the background image of the div to "a.jpg" under the images folder; finally use " background-size" to adjust the size of the background image.

The operating environment of this tutorial: Windows7 system, HTML5&&CSS3 version. This method is suitable for all brands of computers.

Recommended: "css video tutorial"

CSS method to modify the width and height (size) of the background image

In CSS , you can use the background-siz attribute to modify the width and height (size) of the background image.

The background-size attribute can set the width and height of the background image, which can be a percentage value or pixel (px) unit.

Example:

Use the background-image attribute to set the background image of the div to a.jpg under the images folder, and use background-repeat to set the background image so that it does not display repeatedly.

Rendering: Unmodified width and height of the background image

Use background-size to adjust the size of the background image. The first parameter value is the width, and the second parameter value is the height. For example, set the height and width of the background image to half of the original value, that is, 50%.

Open the test.html file in the browser to check the effect.

The above is the detailed content of How to modify the background image width and height with css. For more information, please follow other related articles on the PHP Chinese website!