HTML Tags
HTML <!DOCTYPE HTML> Tag
The <!DOCTYPE html> declaration tells the browser which version of HTML the page uses and must be the very first thing in an HTML document. It switches the browser into standards mode so your CSS and layout behave predictably.
The <!DOCTYPE html> Tag
The <!DOCTYPE> is not an HTML tag; it is an instruction to the web browser about what version of HTML the document is written in. In HTML5 the declaration is deliberately short and version-less. It must appear once, at the very top of the page, before the <html> element.
Its main job is to make browsers render the page in standards mode. If the declaration is missing, browsers fall back to quirks mode, emulating legacy behaviour that can break the modern CSS box model and layout calculations.
Syntax
<!DOCTYPE html>Example
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>My First Page</title>
</head>
<body>
<h1>Hello, world!</h1>
<p>This page runs in standards mode.</p>
</body>
</html>More Examples
The declaration is case-insensitive, so all of the following are valid, though lowercase is the modern convention.
<!DOCTYPE html>
<html>
<body>
<p>Lowercase doctype (recommended).</p>
</body>
</html>Always place <!DOCTYPE html> as the very first line. Even a blank line or comment before it can trigger quirks mode in some browsers.
Older HTML 4.01 and XHTML doctypes were long and referenced a DTD (Document Type Definition), for example <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">. HTML5 removed the DTD requirement, which is why the modern declaration is so short.
Key Takeaways
- <!DOCTYPE html> is a browser instruction, not an element.
- It must be the first line of every HTML document.
- It enables standards mode and prevents quirks mode.
- HTML5 uses a single short, version-less doctype.
- It is case-insensitive but lowercase is the convention.