Shulou(Shulou.com)06/02 Report--

This article focuses on "how to set the background image on css". Interested friends may wish to take a look. The method introduced in this paper is simple, fast and practical. Let's let the editor take you to learn how to set up a background image on css.

The method of setting the background map on css: 1, using the background-image attribute, the syntax "background-image:url (picture url);"; 2, using the background attribute, the syntax "background:url (picture url);".

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

In css, you can set the background image through the background-image property or the background property.

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 fills and boundaries (but not margins). By default, the background-image is placed in the upper-left corner of the element and repeats the vertical and horizontal directions.

Div {width: 450px; height: 360px; background-image: url (img/1.jpg); background-size: 450px * set picture size * /}

The background property is an abbreviated property that sets all the background properties in a declaration, including:

Background-color specifies the background color to use

Background-position specifies the location of the background image

Background-size specifies the size of the background picture

Background-repeat specifies how to repeat the background image

Background-origin specifies the location area of the background image

Background-clip specifies the painting area of the background image

Background-attachment sets whether the background image is fixed or scrolled along with the rest of the page

Background-image specifies one or more background images to use

Example:

Div {width: 450px; height: 360px; background: url (img/2.jpg); background-size: 450px * set picture size * /}

At this point, I believe you have a deeper understanding of "how to set the background image on css". You might as well do it in practice. Here is the website, more related content can enter the relevant channels to inquire, follow us, continue to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.