HTML Head Tags
The <head> section stores metadata such as the page title, character encoding, CSS links and SEO information.
DOCTYPE
<!DOCTYPE html>Title
<title>My Web Page</title>External CSS
<link rel="stylesheet" href="style.css">Common Meta Tags
| Tag | Purpose |
|---|---|
| charset | Character encoding (UTF-8) |
| viewport | Responsive design |
| description | Search engine description |
| keywords | SEO keywords |
| author | Author information |
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<meta name="description" content="HTML Tutorial">
<title>My Web Page</title>
</head>HTML Body Tags
Heading Tags
HTML provides six heading levels: H1 to H6.
<h1>Heading 1</h1>
<h2>Heading 2</h2>
...
<h6>Heading 6</h6>Paragraph Tag
<p>This is a paragraph.</p>
<p>First Line</p>
<p>Second Line</p>Note: HTML ignores indentation and extra spaces. Tags determine the document structure.
Division (<div>) Tag
A block-level container used to group elements for styling and layout.
<div>
<h1>Welcome</h1>
<p>This is a paragraph.</p>
</div>Styling with CSS
.box{
width:300px;
background-color:lightblue;
color:black;
padding:20px;
border:2px solid blue;
text-align:center;
}Text Formatting Tags
Legacy tags: <b>, <i>, <u> (not recommended in HTML5).
Preferred HTML5 tags: <strong>, <em>, <mark>, <small>, <sup>, <sub>.
<p>
<strong>Bold</strong>
<em>Italic</em>
H<sub>2</sub>O
x<sup>2</sup>
</p>Hyperlinks
Hyperlinks are created using the anchor (<a>) tag.
<a href="https://www.google.com" target="_blank">Google</a>
<a href="about.html">About</a>
<a href="mailto:abc@example.com">Email</a>
<a href="tel:+919876543210">Call</a>| Attribute | Purpose |
|---|---|
| href | Destination URL |
| target="_blank" | Open in new tab |
| title | Tooltip |
HTML Lists
Three list types are available.
| Tag | Purpose |
|---|---|
| <ul> | Unordered List |
| <ol> | Ordered List |
| <dl> | Description List |
Unordered List
<ul style="list-style-type:square;">
<li>Apple</li>
<li>Banana</li>
</ul>List style types: disc, circle, square, none.
Ordered List
<ol type="I">
<li>HTML</li>
<li>CSS</li>
</ol>Types: 1, A, a, I, i.
Description List
<dl>
<dt>HTML</dt>
<dd>HyperText Markup Language</dd>
</dl>