Jquery determines the CSS box model (Box Model)

If the page contains a valid doctype declaration, it is displayed in strict mode.
If the page does not have a doctype declaration or there is no valid doctype declaration, it is displayed in compatibility mode.
The following describes the differences between the two modes. The main difference between the two modes is the calculation of the element width and height styles. The following style CopyCodeThe Code is as follows :{
Width: 180px;
Height: 72px;
Padding: 10px;
Bording-width: 5px;
}

In W3C strict mode, the content of an element is displayed in the range of 180 * 72px. The padding and border are out of the 180*72 pixel range. Therefore, the covering area of the entire element is: width: 180 + 10*2 + 5*2 = 210px, height: 72 + 10*2 + 5*2 = 102px.
In ie compatibility mode, the entire element covers an area of 180*72 pixels. The content size is reduced to 180-10*2-5*2 = 150px, and the height is 72-10*2-5*2 = 32px.
It's easy to use jquery to determine box modal. Is the $. boxmodel flag of the bool type. If the page uses the W3C standard model, true is returned. Otherwise, false is returned.