XHTML Tutorial: The Difference Between Transitional and Strict

In fact, XHTML 1.0 is divided into two types (three if Frameset DOCTYPE is included, which is not discussed in this article), Transitional and Strict DOCTYPEs. And HTML 4.01 also has the same document declaration.
Today, when promoting Web standards, those who advocate Web standards often say that XHTML is stricter than HTML. Of course, in a sense it is, for example, it requires all tags to be closed and all attributes to be quoted. But in fact, XHTML 1.0 is divided into two types (three if Frameset DOCTYPE is included, which is not discussed in this article), Transitional and Strict DOCTYPEs. And HTML 4.01 also has the same document declaration.

The meaning can be seen from the literal name: Transitional DOCTYPEs is only for the transition from the old era to the new era, and Strict DOCTYPEs is the default document declaration, which is applicable to the construction of HTML 4.01 and XHTML 1.0.
Transitional DOCTYPE is generally used because the code contains too many old writing methods, and it is difficult to completely convert to Strict DOCTYPE at once. But Strict DOCTYPE should be your goal. It encourages and sometimes even forces you to separate structure from presentation and write presentation code in CSS. HTML 4 Document Type Definition:

This HTML 4.01 Strict DTD does not include presentation layer attributes and tags. W3C will gradually phase out these attributes and tags. You can use style sheets to implement them. You should use the Strict DTD. To get support for presentation attributes and tags, use the Transitional DTD.

Using Strict DOCTYPE has the added benefit of telling browsers to render the page in their most strict and (to a certain extent) most standards-compliant mode.
Tommy Olsson explains the benefits of using Strict well in Ten questions for Tommy Olsson from the Web Standards Group:

I think that using Strict DTD, whether it is HTML 4.01 Strict or XHTML 1.0 Strict, is far more important than discussing whether to use HTML or XHTML. It represents the quality of the future Internet. It separates structure from presentation, making it very easy to maintain a site.

For those new to web standards and proper, semantic structure, it is important to recognize the difference between Transitional and Strict DOCTYPEs. For a more detailed list, please refer to: XHTML: Differences between Strict & Transitional, Comparison of Strict and Transitional XHTML and XHTML1.0 Element Attributes by DTD.
For those who are ready to move to Strict, there are some differences between the two that are likely to cause developers to make mistakes, which I will talk about next. Tags not supported in Strict DOCTYPEs center font iframe srike u Attributes not supported in Strict DOCTYPEs align (supported by table-related: col, colgroup, tbody, td, tfoot, th, thead, and tr) language background bgcolor border (supported by table) height (supported by img and object) hspace name (supported in HTML 4.01 Strict, not supported by form and img in XHTML 1.0 Strict) noshade nowrap target text, link, vlink, and alink vspace width (supported by img, object, table, col, and colgroup) Differences in content models The content model of an element type describes what kind of instances of that element type can be contained. In this regard, the biggest difference between the two document declarations is that blockquote, body, and form elements can only contain block-level elements, such as: text and images are not allowed to be directly included in the body, they must be included by block-level elements such as p or div input elements cannot be directly the next layer of form elements text within blockquote elements must be included by block-level elements such as p or div Leave all presentation to CSS and adhere to Strict standards In the process of transitioning to Strict DOCTYPEs, it is much more effective to understand what each element does than to know what each element looks like.
Think about structure and semantics first, then worry about performance.

<<: Vue implements the digital thousands separator format globally

>>: CSS navigation bar menu with small triangle implementation code

SQL implementation of LeetCode (177. Nth highest salary)

XHTML Tutorial: The Difference Between Transitional and Strict

SQL implementation of LeetCode (177. Nth highest salary)

Usage of MySQL time difference functions TIMESTAMPDIFF and DATEDIFF

Native js implements a minesweeper game with custom difficulty

Completely uninstall MySQL database in Windows system to reinstall MySQL

js to achieve simple front-end paging effect

How to skip errors in mysql master-slave replication

Summary of some common configurations and techniques of Nginx

A brief analysis of the matching priority of Nginx configuration location

Nginx load balancing configuration, automatic switching mode when downtime occurs

Some CSS questions you may be asked during an interview

Recommend

Network configuration of Host Only+NAT mode under VirtualBox

Detailed explanation of script debugging mechanism in bash

Detailed explanation of the principle of js Proxy

What are the differences between CDN, SCDN, and DCDN for website acceleration? How to choose?

Cross-host communication between docker containers-overlay-based implementation method

VMware12 installs Ubuntu19.04 desktop version (installation tutorial)

Simple example of using Docker container

Detailed explanation of the process of Zabbix active, passive and web monitoring in distributed monitoring system

Docker executes a command in a container outside the container

How to create WeChat games with CocosCreator

Vue-Router installation process and principle detailed

Vue implements automatic jump to login page when token expires

Detailed process of using vmware to test PXE batch installation server

How to use Vue to implement CSS transitions and animations

Detailed tutorial on installing php-fpm service/extension/configuration in docker