HTML BoilerPlate
The HTML boilerplate is the basic structure of an HTML document that includes the essential tags and elements needed to create a well-formed HTML page. It's the foundation or starting template for any HTML document.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Your Page Title</title>
<!-- Link to external CSS or other resources can go here -->
</head>
<body>
<!-- Content of the webpage goes here -->
</body>
</html>
<!DOCTYPE html>
:
It declares the document type and version of HTML (HTML5 in this case).It ensures that the browsers render the page correctly.
<html lang="en">
:
The root element of the document.The
lang
attribute specifies the language of the document (en
stands for English).<head>
:
The head contains metadata (information about the document) like the character set, viewport settings, and the title.It also links files such as CSS, JavaScript, or other resources.
<meta charset="UTF-8">
:Defines the character encoding for the document (UTF-8 is standard for most languages).
<meta name="viewport" content="width=device-width, initial-scale=1.0">
:Ensures that the page is responsive and scales properly on different devices like mobile phones or tablets.
<meta http-equiv="X-UA-Compatible" content="IE=edge">
:Ensures the page is displayed in the latest supported version of Internet Explorer.
<title>Your Page Title</title>
:Sets the title of the webpage, which appears on the browser tab.
<body>
:Contains all the visible content of the page like text, images, links, etc.
Examples :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Html boiler plate</title>
<!-- Link to external CSS or other resources can go here -->
</head>
<body>
<h1>Example using Boiler Plate</h1>
<p>Lorem ipsum dolor sit, amet consectetur..</p>
</html>