What is DOCTYPE in HTML and How it's help?
The <!DOCTYPE> declaration in HTML specifies the document type and version of HTML being used. It helps the browser understand how to render the content correctly. Without it, the browser might enter "quirks mode," where it renders the page in a less standardized way, potentially causing display issues.
<!DOCTYPE html>
<html>
<head>
<title>Sample Page</title>
</head>
<body>
<p>Hello, World!</p>
</body>
</html>
In this example, <!DOCTYPE html> tells the browser to use the latest HTML5 standard.
Quirks mode:
Quirks Mode is a browser mode that emulates the behavior of older browsers, rendering web pages as they would appear in the late 1990s and early 2000s. This mode is triggered when the <!DOCTYPE> declaration is missing or incorrect, leading to inconsistencies in layout and styling across different browsers.
Example:
If a web page is missing the <!DOCTYPE html> declaration:
<html>
<head>
<title>Quirks Mode Example</title>
<style>
div { width: 200px; padding: 20px; }
</style>
</head>
<body>
<div>This is a test.</div>
</body>
</html>
In Quirks Mode, the width of the div might be calculated differently, ignoring the box model standards, resulting in unexpected layout behavior. This could cause the div to appear wider or narrower than intended.