How to set background image in css-Front-end Q&A-php.cn

How to set background image in css

藏色散人

Release： 2023-01-05 16:10:41

Original

9652 people have browsed it

How to set the background image in css: first create an HTML sample file; then create a div in the body; finally set it through the "background-image: url("images/22.jpg");" attribute Just a background image.

How to set background image in css

The operating environment of this article: Windows7 system, HTML5&&CSS3 version, Dell G3 computer.

css can set the background image through the background-image attribute. The background-image attribute is used to set the background image of an element.

The background of an element is the total size of the element, including padding and borders (but not margins). By default, the background-image is placed in the upper left corner of the element and repeats both vertically and horizontally.

css syntax:

background-image：url|none|inherit

Copy after login

background-image attribute value:

url URL of the image

none No image background will be displayed. This is the default

inherit specifies that the background image should be inherited from the parent element

[Recommended learning: css video tutorial]

Example:

<!DOCTYPE html>
<html>
<head>
<style>
div{
width:450px;
height: 300px;
background-image: url("images/22.jpg");
}
</style>
</head>
<body>
<div></div>
</body>
</html>

Copy after login

Rendering:

How to set background image in css

background attribute value:

background-color specifies the background color to be used

background-position specifies The position of the background image

background-size specifies the size of the background image

background-repeat specifies how to repeat the background image

background-origin specifies the positioning area of the background image

background-clip Specifies the drawing area of the background image

background-attachment Sets whether the background image is fixed or scrolls with the rest of the page

background-image Specifies one or more to use background images

The above is the detailed content of How to set background image in css. For more information, please follow other related articles on the PHP Chinese website!