Learn How to Declare HTML DOCTYPE tag
This HTML article explains to you how to use an HTML element called the <!DOCTYPE> tag with proper syntax and examples.
Description of HTML <!DOCTYPE> tag
The HTML <!DOCTYPE> tag is the starting line in the HTML code. <!DOCTYPE> tag tells the browsers what version of HTML the script is written and what to expect from this HTML code. This <!DOCTYPE> tag is also commonly referred to as the <!DOCTYPE> element.
Syntax of <!DOCTYPE>
The syntax for the <!DOCTYPE> tag changes between the version of XHTML or HTML you are using. Now check out the most common usages of <!DOCTYPE>
The syntax in HTML5 is:
<!doctype html>
The syntax in HTML 4.01 is:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
The syntax in XHTML 1.0 is:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
The syntax in XHTML 1.0 is:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
The syntax in XHTML 1.1 is:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
Tips and Notes on HTML
<!DOCTYPE> tag
Tip: The <!DOCTYPE> the declaration is NOT case-sensitive.
HTML (Hypertext Markup Language) constitutes a pivotal element in web development, playing a vital role in generating web pages. Consequently, acquiring an understanding of its manifold components and tags proves indispensable for efficient web development.
One of the indispensable tags in HTML concerns the <!DOCTYPE> tag, which signals the HTML rendition employed in the web page. This tag informs the web browser of the markup language employed in the web page, thereby enabling it to display the page accurately.
The <!DOCTYPE> tag finds its place at the outset of the HTML document, serving as the initial line of code in the document. This tag must be integrated into every HTML document to guarantee the proper rendering of the page by the web browser.
It’s worthy of note that the <!DOCTYPE> tag lacks an end tag, rendering it a self-contained tag. Additionally, the tag may feature different variations contingent on the version of HTML implemented in the document.
To sum up, the <!DOCTYPE> tag represents an essential constituent of HTML, functioning as the opening line of code in an HTML document and indicating the version of HTML employed in the document. Therefore, it remains imperative to integrate this tag into each HTML document to ensure proper web page rendering by web browsers.
Browser Compatibility of <!DOCTYPE>
The <!DOCTYPE> tag has basic support with all the following browsers:
- Chrome
- Android
- Firefox (Gecko)
- Firefox Mobile (Gecko)
- Internet Explorer (IE)
- Edge Mobile
- Opera
- Opera Mobile
- Safari (WebKit)
- Safari Mobile
Example of <!DOCTYPE> Declaration
In the examples below, we will discuss all the examples of how to use HTML tags in HTML5, HTML 4.01 Transitional, XHTML 1.1, XHTML 1.0 Transitional, and XHTML 1.0 Strict.
HTML5 Document
HTML 5 document, the <!DOCTYPE> tag code might look like this as shown below:
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>HTML5 Examples in www.home4cloud.com</title>
</head>
<body>
<h1>Biggest Heading comes under this tag</h1>
<p>This line is written inside the paragraph tag.</p>
</body>
</html>In this HTML5 Document example, the <!DOCTYPE> tag is on the first line, which is not contained within the <html> tag.
HTML 4.01 Transitional Document
HTML 4.01 Transitional document, the <!DOCTYPE> tag code might look like this as shown below:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>HTML 4.01 Transitional Example by www.home4cloud.com</title>
</head>
<body>
<h1>Biggest Heading comes under this tag</h1>
<p>This line is written inside the paragraph tag.</p>
</body>
</html>In this above HTML 4.01 Transitional document, the <!DOCTYPE> tag code is on the first line, which is not inside <html> tag.
XHTML 1.0 Transitional Document
XHTML 1.0 Transitional document, the <!DOCTYPE> tag code might look like this as shown below:
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>XHTML 1.0 Transitional Example in www.home4cloud.com</title>
</head>
<body>
<h1>Biggest Heading comes under this tag</h1>
<p>This line is written inside the paragraph tag.</p>
</body>
</html>In this above XHTML 1.0 Transitional document, the <!DOCTYPE> tag code is on the first line, which is not inside <html> tag.
XHTML 1.0 Strict Document
XHTML 1.0 Strict document, the <!DOCTYPE> tag code might look like this as shown below:
<!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>XHTML 1.0 Strict Example in www.home4cloud.com</title>
</head>
<body>
<h1>Biggest Heading comes under this tag</h1>
<p>This line is written inside the paragraph tag.</p>
</body> </html>In this above XHTML 1.0 Strict document, the <!DOCTYPE> tag code is on the first line, which is not inside <html> tag.
XHTML 1.1 Document
XHTML 1.1 document, the <!DOCTYPE> tag code might look like this as shown below:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>XHTML 1.1 Example in www.home4cloud.com</title>
</head>
<body>
<h1>Biggest Heading comes under this tag</h1>
<p>This line is written inside the paragraph tag.</p>
</body>
</html>In this above XHTML 1.1 document, the <!DOCTYPE> tag code is on the first line, which is not inside <html> tag.
