How to control the background of a Web page with CSS

How to use CSS to control the background of a Web page in accordance with standard Web design? Some questions, including background colors, background pictures, and more, are made clear in this tutorial.

• Background Color Background-color

I think this I don't have to do more introduction, color code I think we all know, not in English to replace is to use the specified code to express. The default value for this is transparent (transparent color).

Example: Body{background-color:yellow}

H1{background-color: #000000}

• Background picture Background-image

Background image and background color in the HTML inside the settings are basically the same, can be added to the relevant statements to complete. But here, I am not referring to this method, I use the method or CSS. Background-image This main function is also used to display pictures, if you need to display pictures, then as long as the following URL (image address) on it, do not show it, it is the simplest, nothing on the line, because the default is None, And to add the words, is to add this after the none on it.

Example: Body{background-image:url (file&:///c:/windows/backgrnd. GIF)}h1{background-image:url (None)}

Everyone in the use of the background picture, must often encounter some pictures because too small, and produce all sorts of pictures such as repeated appearance and destroy the whole page of beauty, want to replace other pictures and the wrong kind of trouble. But now, everyone just use the following CSS to control the image method, then you will not have this kind of trouble happen again.

• Does the picture repeat the display background-repeat

Sometimes repeated display is needed, but sometimes repeated display is a headache, now this can help you very well, and it can also help you control the way the picture repeats (horizontal repeat, vertical direction repeat and two directions are repeated), And to achieve these three directions of repetition as long as in the back of the Bcackground-repeat plus repeat-x (horizontal direction), repeat-y (vertical spread), repeat (spread out in two directions). Of course, it can control the repetition of the picture, also can control the picture does not repeat. No-repeat This is used to show only a background picture, rather than repeating, this is not the default yo, the default is to repeat the background picture (repeat).

Cases:

Body{background-image:url (file&:///c:/windows/backgrnd. GIF); Background-repeat:no-repeat}