DOCTYPE is compatible with standard and compatible modes
The role of DOCTYPE and the differences between standard and compatible modes
Differences between standard mode and compatible mode: Standard ModeBoth the typographical and JS operating modes run according to the highest standards supported by the browser. InCompatibility modeThe page is displayed in a loose and backward compatible manner, simulating the behavior of the old-fashioned browser to prevent the site from working.
Specific differences:
1. Box Model
In strict mode, width indicates the content width, and the true width of the element is width;
In compatibility mode: width is = width + padding + border
2. In compatibility mode, you can set the height of the percentage and the height and width of the element in the row.
In Standards mode, setting wdith and height for row elements such as span does not take effect, but in compatibility mode, it takes effect.
In standards mode, the height of an element is determined by the content it contains. If the parent element does not set the height, the height of the child element setting a percentage is invalid.
3. Setting the horizontal center in IE with margin: 0 auto will fail.
Using margin: 0 auto can center the elements horizontally in standards mode, but it fails in compatibility mode (solved using the text-align attribute)
Body {text-align: center };# content {text-align: left}
4. In compatibility mode, the font attribute in the Table cannot inherit the upper-layer settings. white-space: pre will be invalid, and the padding setting of the image will be invalid.