Correct understanding of HTML and body

Standard and non-standard mode

After standard mode, definitions and parsing will be more rigorous, and all definitions must start with top-level tag HTML.

It can be understood that the traditional standard pattern defines the use of the body, which must be defined on HTML in standard mode.

The significance of the height 100%

It is the wrong theory to define the container height 100% invalid in standard mode.

If you want the body inside the container has 100% height, you must first define the body height of 100%.

Default values for HTML and body

1. IE6.0 environment under the HTML default has 2 layer border embedded effect, FF1.5 environment default is not, this is IE6.0 definition border:0 before and after effect:

2. IE6.0 and FF1.5 environment of the body have a certain margin value, the specific number of subtle differences, this is the default in two client effects:

3. IE6.0 Environment HTML default is 100% height, body is not; FF1.5 environment HTML and body height default is not 100%, need to customize.

In general, the default scenario is unified:

html { height:100%; border:0;}
body { height:100%; margin:0;}

The setting of the scroll bar

It can be argued that the default scroll bar for a standard mode page is the body, while the standard is HTML.

The body in standard mode defaults to no scroll bar, just a container for the HTML subordinate, so the definition will look clearer:

html { background:#ccc; height:100%; border:0; overflow:scroll;}
body { background:#f00; height:100%; margin:0; overflow:scroll;}

Locating references

In the same way, when using the position method in standard mode, its positioning reference must be HTML rather than the body of a standard pattern.

According to this feature, it's easy to cover the body with a layer.