CSS for picture settings background picture _ Experience Exchange

The function of CSS is very powerful, for the performance of the elements and the layout of the page, all provide a very powerful function, this is mainly in our flexible operation, in this respect provides a rich and valuable variety of tutorials and information. For the use of pictures, in fact, more is in the content layer. According to the Web Standard idea, the performance layer of the picture, has been separated into the CSS. Only images that are content can be inserted into the page with an IMG tag, which is also a constant emphasis on semantics.

Setting a background picture for a picture is a very real example. This sentence may feel a little fun. We set up a background picture for a picture that introduces an IMG tag into a page. The scope of this application may not be very large, but you can exercise your ideas, so that you understand the elements in HTML and CSS meaning and flexibility.
Let's look at the code below.


This is the introduction of the image into the page with an IMG tag.

We'll write CSS again.


IMG {
Display:block;
width:443px;
height:60px;
padding-bottom:10px;
Background:url (jb52bg.jpg) no-repeat left bottom;
}
Converts an IMG element to a block element, setting width and height. Set the inner margin of the lower side to 10px. For the background picture shown out to reserve a certain space. Finally, you can define the background picture.
This small example, you can see the flexibility of CSS and powerful features.