htmlのbackground-image属性の設定について説明します。

    Oh, the idea is good, but does the browser you are using support it? I think IE or FF must be ignored. You may ask, I once designed the forum style, it is possible to achieve ah? I think, if only the above code, then it is not possible to control the image, because it only controls the size of the BODY. Of course, here is also can not control. If it is other ID markers, I think it is possible to control the size of the range of the marker, huh, of course, it is not the size of the image.
    To be honest, this problem is not only bothering you guys, but also me. Because it's just a property value, not a real counterpart. Hehe remember to let me know if you think of using CSS to control it.

    Addendum: The W3C released an article on September 10 called "CSS Backgrounds and Borders Module Level 3", which adds several properties to CSS backgrounds that we've never seen before.

background-clip.
/{br background-origin :
background-size: the size of the background.
background-break : The size of the background.

    These properties are available, but there are no browsers that support them yet. What a pain in the ass.
(4), Position control of the background image.

    The background image, my section is to guide in, but its position is really a little unacceptable. Because its default is the top left alignment. But we don't want to place it this way, so what do we do. Don't worry, the exciting moment is coming, now let's get to know background-position, background-position-x and background-position-y.

    a. Basic syntax:

background-position : length || length
background-position : position || position
background-position-x : length | left | center | right
background-position-y : length | top | center | bottom

    b. Syntax values:

length :percent | Length value consisting of a floating point number and a unit identifier.
position : top | center | bottom | left | center | right

    c. Example.

body { background-image: url("d:\images\04.jpg"); background-position: 50% 50%; background-repeat:no-repeat; }
body { background-image: url("d:\images\04.jpg"); background-position-x: 50%; background-repeat:no-repeat; }
body { background-image: url("d:\images\04.jpg"); background-position-y: 50%; background-repeat:no-repeat; }

    For values of length | top | center | bottom I'll just write the following three examples.

body { background-image: url("d:\images\04.jpg"); background-position: top right; background-repeat:no-repeat; }
body { background-image: url("d:\images\04.jpg"); background-position: 50% center; background-repeat:no-repeat; }
body { background-image: url("d:\images\04.jpg"); background-position: 60px center; background-repeat:no-repeat; }

    After all these examples, I think you have some idea about positioning, right?

(5), the background image transparency settings.

    There are times when we always think to set the image to be transparent.

(6), Setting of multiple background images.

    For the setting of multiple background images, I read about it in Beyond CSS: The Essence of WEB Design Art. However, I'm sorry to say that there are too few browsers that support multiple background images in one tab, and the only one I know of is Apple Safari. How is this possible, you may ask. After you look at this example, I think you'll be surprised, "Gee, CSS3 used to only use one image per element." If you want to look into it, just get a SAFARI browser installed. For me, I believe that this is the way to go. In a word, the stronger the ability to explain CSS, the more it will be the trend of development, and whoever has the perfect WEB standards will be the browser star of tomorrow.
{The better the interpretation of CSS, the better it will be.
 The code is as follows.