Add a background image to a web

Sometimes we do a simple placeholder page out,This page does not need any of the content,Simply a background image to chapter,But simple things are often more difficult to achieve。

This is what I wrote a page directly encountered problems,Code like this:

It looks perfect solution, right? But actually they encountered a problem a pit father - white side! and,Wider than the width of the browser so a crack!

Ok,I div removed - too,Now no more than the width,But all around! Yes! White! side! La!

After viewing the page elements to find such a ghost ...... Well,As an amateur front end,I expressed this problem has troubled me for half an hour?

Css appear inexplicable

Css appear inexplicable

User agent style

The user agent style in the end is what? Obviously I did not write ah!

Various HTML tags:h1-h6,p,the,ol,dl "Even without them define style property values,They displayed in a browser,Property also has a variety of styles(Mainly a variety of font sizes and spacing)。This is because browsers these tags and CSS to set the default style property values。

that is,This is the browser that comes with!

Yeah your sister?Give me comes with a white border you are sick of it! My big black IE ah ......

In short,Experienced not directly write div background not write,Add to tangle body nor the background after,I finally realized that I should write a css to override the browser's built-css。

Overwrite the browser that comes with css

So,We'll have to add an extra page to the body css out:

Then,We put it into the pages:

Such,Page was finally able to sit safely on a full-screen display of the background image?

Original article written by Gerber drop-off:R0uter's Blog » Add a background image to a web

Reproduced Please keep the source and description link:

About the Author


The non-declaration,I have written articles are original,Reproduced, please indicate the link on this page and my name。

Leave a Reply

Your email address will not be published. Required fields are marked *