Differences in strict and quirk modes.
To write a cross-browser CSS, you must know the two modes of the browser parsing CSS: Standard mode (strict modes) and weird mode (quirks modes).
The so-called standard mode refers to the browser in accordance with the standards of the code to parse the execution, the weird mode is to use the browser's own way to parse the execution code, because the different browser parsing executes differently, so we call it a strange mode. whether the browser resolves using standard mode or weird mode, directly related to the DTD declaration in your Web page, the DTD declaration defines the type of standard document (standard schema Parsing) document type, causes the browser to load the Web page and display it in the appropriate way, ignoring the DTD declaration, which will put the Web page into a weird mode (quirks mode).
<html> <head> <title>重庆PHP</title> </head> <body> <h3>重庆PHP，最专业的PHP社区</h3> </body></html>
If your Web page code does not contain any declarations, then the browser will parse it in weird mode, that is, if your page code contains a DTD declaration, the browser will parse it according to the criteria you have declared.
<! DOCTYPE HTML PUBLIC "-//w3c//dtd HTML 4.01 transitional//en" "Http://www.w3.org/TR/html4/loose.dtd"; <html ; <head , <title ; Chongqing php</title ; </< Span class= "Hljs-title" >head ; <body <h3 ; Chongqing PHP, the most professional PHP community </h3 ; </ body ; </html ;
The above code, the browser will be parsed according to the standard of HTML 4.01.
What's the difference between a standard pattern and a weird pattern? In my previous article, IE does not recognize the!important statement, it has been said in the standard mode
IE6 do not know!important statement, IE7, IE8, Firefox, Chrome and other browsers know, and in the strange mode, ie6/7/8 do not know!important statement, this is only one of the differences, there are many other differences. So, to write a cross-browser CSS, you have to use standard mode. It seems too absolute, hehe. Well, if you want to write cross-browser CSS, you'd better use standard mode.
What are the statements? What kind of statement is better? We recommend that you use the XHTML 1.0 strictest mode, from the very beginning we should strictly ask ourselves.
The specific statement is as follows:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><!-- 如果你接手的是一个遗留网页，最初并没有DTD声明，并且使用了很多在XHTML中已经废除的标签，那么，我们建议你使用XHTML兼容模式，声明如下： --><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
Differences between the quirk and strict modes:
the difference between the box model and the rendering mode
In strict mode:
Width is the content width, that is, the element's true width =
margin-left + border-left-width + padding-left + width + padding-right + border-right-width + margin-right;
In quirks mode:
Width is the actual width of the element, content width =
width - (margin-left + margin-right + padding-left + padding-right + border-left-width + border-right-width)
Use Document.compatmode to show why the pattern
There is one difference between quirks mode and strict mode, but it is not verified and I just find this phenomenon.
In strict mode,
The CSS property of table Font-size inherits the parent element, that is, the font size in the table inherits the size of the parent element font.
In quirks mode,
The CSS property of table Font-size does not inherit from the parent element and needs to be set up specifically. In other words, the font size in the table does not inherit the size of the parent element font.
Differences in strict and quirk modes
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
