Some web pages are created according to standards, but there are also many that are not. Even if you can't create web pages that follow the standards, you want the browser to display those pages correctly according to the standards. Currently, a large number of web pages are filled with a lot of non-standard code, and they still work properly. In fact, most code designed for older browsers will be displayed correctly in newer browsers (although there may be differences in how it is rendered). What is the reason for this? In fact, strictly following the latest standards will completely undermine the survival basis of those pages. This is certainly unacceptable for any browser that wants to make a difference.
Browser rendering mode
Modern browsers include different rendering modes, with the aim of supporting both web pages that follow standards and web pages designed for older browsers. Among them, Standards mode (that is, strict presentation mode) is used to present web pages that follow the latest standards, while Quirks mode (that is, loose presentation mode or compatibility mode) is used to present web pages designed for traditional browsers. Also, note that Mozilla/Netscape 6 has added an Almost Standards mode to support web pages designed for an older version of the standard.
What is doctype switch?
The doctype declaration placed at the top of the web page is the key to getting the browser into the correct rendering mode. The browser automatically switches to the appropriate rendering mode to correctly display the document type specified by the doctype declaration.
In theory, this should be a very intuitive switch. If doctype points out that the current web page is a document that complies with the standard (ie HTML 4+ or XHTML 1+), the browser will switch to Standards mode. If the doctype is not specified, or HTML 3.2 and older versions are specified, the browser switches to Quirks mode. In this way, the browser can display the documents that follow the standards correctly without completely abandoning old-fashioned web pages that do not match the standards.
Doctype switching problem
However, doctype switching is an incomplete solution. Even if you use a doctype declaration in your web document, the browser may not take the rendering mode you want to display the web page. There are many reasons, including the doctype of the wrong form, and different beginnings of <?xml version=1.0 encoding=UTF-8?>) which includes the XHTML web page. However, IE, Opera, and older versions of Safari all want the first line of the document to be the doctype declaration. So, if there is anything else before it (including XML prolog), the doctype is not recognized. Therefore, the existence of XML prolog will bring IE, Opera, and Safari into Quirks mode. XML prolog is not required, so you can safely omit it in the XHTML webpage. Note: Be sure to include a charset attribute in the http-equiv meta tag to make up for the missing encoding attribute in the XML prolog.
Missing URL or relative URL:
In the complete doctype declaration, include the URL of the corresponding document type definition (DTD) file. If the URL is lost, or if it is specified, a relative path (rather than a fully qualified Internet address), most browsers will enter Quirks mode, regardless of the mode specified by the doctype declaration.
Doctype of wrong form:
The browser is very sensitive to the form and format of the doctype declaration, and if a doctype incorrect form cannot be recognized, it will force into Quirks mode (for this reason, we recommend copying and pasting a known correct doctype into the document instead of typing it in person). A common reason for the form error doctype is that a space is missing between the first part of doctype and the URL. Collapse a doctype divided into two lines into a single line, and that space will often be lost.
The transition period doctype:
When a browser handles the transition period doctype, it is most likely to have inconsistent problems. IE and Opera use Standards mode; Netscape 6 and older versions of Safari use Quirks mode; Netscape 7, Mozilla 1 and newer versions of Safari use Netscape's Almost Standards mode, which is a better fault-tolerant version of Standards mode.
Unknown doctype:
There is also inconsistency when the browser handles unrecognized doctypes. IE and Opera will enter Standards mode; in other words, it assumes that unrecognized doctype is a new standard that has not been integrated in the browser. On the contrary, Netscape 6 will switch to Quirks mode when encountering unrecognized doctypes.
Doctype switching may be an effective means to get the browser to enter the correct rendering mode and display the web page correctly, provided that you notice inconsistencies in various browsers and can actively avoid various problems.
2. Use the correct doctype declarationWe may ignore this when making pages (including me, I am usually lazy to not write and use the browser default). With the arrival of the current craze for standardization of web page encoding, it is necessary for everyone to understand this detail, which will be useful. As the saying goes, there is no order without rules.
While most web documents have doctype declarations at the top, many people are not paying attention to it. It is one of many details that are sloppy by web authoring software when you create a new document. While doctype is overlooked by many, it is a necessary element in any web document that follows the standards. Doctype affects code verification and determines how the browser ultimately displays your web documentation.
The role of doctype
The doctype statement points out what rule sets should be used by the reader to interpret the tags in the document. In the case of web documents, the reading program is usually a program such as a browser or a verification device, and the rules are the rules contained in a document type definition (DTD) published by W3C.
Each DTD includes a series of tags, attributes, and properties that are used to mark the content of a web document; and also includes rules that specify which tags can appear in which other tags. Each web-suggested standard (such as HTML 4 Frameset and XHTML 1.0 Transitional) has its own DTD. If the tags in the document do not follow the DTD specified by the doctype declaration, the document may not be displayed correctly in the browser in addition to not passing code verification. The browser is more tolerant than the verification device for the problem of inconsistent markups. However, incorrect doctype declarations often cause web pages to be displayed incorrectly, or cause them to not be displayed at all.
Select the correct doctype
In order to obtain the correct doctype declaration, the key is to make the DTD correspond to the standards that the document follows. For example, assuming that the document follows the XHTML 1.0 Strict standard, the doctype declaration of the document should refer to the corresponding DTD. On the other hand, it is inappropriate if the doctype declaration specifies XHTML DTD but the document contains old-style HTML tags; similarly, it is also inappropriate if the doctype declaration specifies HTML DTD but the document contains XHTML 1.0 Strict tags.
Sometimes, you can not use a doctype declaration at all. If no valid doctype declaration is specified, most browsers will use a built-in default DTD. In this case, the browser will use the built-in DTD to try to display the tag you specified. For some temporary, hasty pieces of documents (there are many of them), you can indeed consider omitting the doctype declaration and accepting the browser's default display.
It is entirely possible to write a doctype declaration from scratch and let it point to a DTD of your choice. However, since most web documents need to follow an internationally recognized web standard published by W3C, those documents usually contain one of the following standard doctype declarations:
HTML 2: <!DOCTYPE html PUBLIC -//IETF//DTD HTML 2.0//EN>
HTML 3.2: <!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 3.2 Final//EN>
HTML 4.01 Strict: <!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01//EN http://www.w3.org/TR/html4/strict.dtd>
HTML 4.01 Transitional: <!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN http://www.w3.org/TR/html4/loose.dtd>
HTML 4.01 Frameset: <!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01 Frameset//EN http://www.w3.org/TR/html4/frameset.dtd>
XHTML 1.0 Strict: <!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Strict//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd>
XHTML 1.0 Transitional: <!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd>
XHTML 1.0 Frameset: <!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Frameset//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd>
XHTML 1.1: <!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.1//EN http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd>
XHTML 1.1 plus MathML plus SVG: <!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.1 plus MathML 2.0 plus SVG 1.1//EN http://www.w3.org/2002/04/xhtml-math-svg/xhtml-math-svg.dtd>
In addition to the doctype declaration listed above, some documents with special requirements use several other declarations.
The doctype declaration is usually the first line of the document, before the <html> tag and other document content. Note that in the XHTML document, an XML processing instruction (also known as XML prolog) appears occasionally in front of the doctype: <?xml version=1.0 encoding=utf-8?>
To ensure that the web page is displayed correctly and passes verification smoothly, using the correct doctype is key. Doctypes that are opposite, incorrect or incorrect in form are the culprits of a large number of problems.
When designing a web page with DW, create a new file and see that there is always something below at the front of the code.
<!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN http://www.w3.org/TR/html4/loose.dtd> This is DW that automatically adds DTD information to the web page file page, which can be deleted. After deletion, the browser will use the default DTD.
3. What kind of DOCTYPE to choose
When you start creating a site that meets the standards, the first thing you do is to declare a DOCTYPE that meets your needs.
Check the original code of this page and you can see that the first line is: <!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd>
Open some sites that meet the standards, such as the personal website of famous web design software developer Macromedia and design master Zeldman, and you will find the same code. The code for other sites that meet the standards (such as k10k.net) is as follows:
<!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Frameset//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd>!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd>br>. The complete code is as follows:
<!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd>!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd>
What kind of DOCTYPE should we choose
The ideal situation is of course a strict DTD, but for most of us designers who are new to web standards, transition DTD (XHTML 1.0 Transitional) is currently an ideal choice (including this site, which also uses transitional DTD). Because this DTD also allows us to use the identity, elements and attributes of the presentation layer, it is also easier to pass W3C code verification. Note: The logo and attributes of the presentation layer mentioned above refer to those tags that are purely used to control performance, such as tables for typesetting, background color marks, etc. In XHTML, the identity is used to represent structures, not to implement expressions. Our transition is to ultimately separate data and representations.
For example: a nude model changes clothes. Models are like data, and clothes are manifested in form, and models and clothes are separated, so you can change clothes at will. It turns out that in HTML4, data and performance are mixed together, and it is very difficult to change the expression form at one time. Haha, it’s a bit abstract, and we need to gradually understand this concept during the application process.
Replenish
DOCTYPE declarations must be placed at the top of every XHTML document, above all code and identities.
4. This is how the official defines DOCTYPE HTML PUBLIC!DOCTYPE
--------------------------------------------------------------------------------
Specifies the document type definition (DTD) that the HTML document follows.
New to Microsoft? Internet Explorer 6. You can use this statement to switch Internet Explorer 6 and later to standard compatibility mode.
grammar
HTML Top-level Element Availability Registration //Organization //Type Tags //Definition Language URL
Possible values
Top-level element: Specifies the top-level element type declared in DTD. This corresponds to the declared SGML document type. HTML default. HTML.
Availability: Specifies whether the official public identifier (FPI) is publicly accessible object or system resource. PUBLIC default. Publicly accessible object. SYSTEM system resources, such as local files or URLs.
Registration: Specify whether the organization is registered by the International Organization for Standardization (ISO). + Default. Organization name registered. - Organization name not registered. The Internet Engineering Task Force (IETF) and the World Wide Web Association (W3C) are not registered ISO organizations.
Organization: Specifies the name of the group or organization that indicates the creation and maintenance of the DTD referenced by the !DOCTYPE declaration, namely OwnderID. IETF IETF. W3C W3C.
Type: Specifies the public text class, that is, the type of object referenced. DTD default. DTD.
Tag: Specifies a public text description, that is, a unique descriptive name for the cited public text. Version number can be included later. HTML default. HTML.
Definition: Specify the document type definition. Frameset Frameset Documentation. Strict excludes all representative attributes and elements that W3C experts want to phase out, because the style sheets are already perfect. Transitional contains all contents except the frameSet element.
Language: Specifies a public text language, that is, a natural language encoding system used to create the referenced object. The language definition has been written as ISO 639 language code (capital two letters). EN Default. English.
URL: Specifies the location of the referenced object.
Comments
This declaration must appear at the beginning of the document, before the html tag.
!DOCTYPE element does not need to close the tag.
This element is available in HTML for Microsoft? Internet Explorer 3.0.
You can use this declaration to switch to strict standard compatibility mode in Internet Explorer 6 and later. To turn on this switch, include the !DOCTYPE declaration at the top of your document, specifying a legal tag in the declaration, and in some cases, a definition and/or URL are also required.
Note In standard compatibility mode, compatibility with other versions of Internet Explorer cannot be guaranteed. When standard compatibility mode is turned on, the rendering behavior of the document may be different from that of a future version of Internet Explorer. If the content is originally fixed (such as burned on a CD), this mode should not be used.
Example
The following example demonstrates how to use !DOCTYPE declarations specify the DTD to which the document complies and switch Internet Explorer 6 and later to standard compatibility mode. The declarations in the following examples specify HTML 4.0 DTD compliance. The second declaration specifies Strict. The first declaration is not specified. Both statements will switch Internet Explorer 6 and later to standard compatibility mode.
<!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.0//EN>
<!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.0 Strict//EN>
The declarations in the following examples specify DTD compliance with TransitionalHTML 4.0. The second declaration specifies the URL of DTD. The first declaration is not specified. The second statement will switch Internet Explorer 6 and later to standard compatibility mode. The first statement will not.
<!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.0 Transitional//EN>
<!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.0 Transitional//EN
http://www.w3.org/TR/html4/loose.dtd>