Name of Function What is the function of the tag?
Code line example/layout
<!DOCTYPE html> Defines the document type as HTML5. <!DOCTYPE html>
<html lang="en"> Root element of an HTML page, language <html lang="en">
set to English.
<meta charset="UTF-8"> Defines the character encoding for the <meta charset="UTF-8">
document.
<meta name="viewport" Makes the page responsive on all devices <meta name="viewport"
...> supporting its view on all devices. content="width=device-width,
initial-scale=1.0">
<head> Container for metadata (title, links, scripts). <head>
<title> Sets the page title (appears in browser <title>HTML Tags Example</title>
tab).
<body> Contains all visible content of the page. <body>
<h1> (or <h2>, <h3>, Defines headings (h1 = largest, h6 = <h1>This is a Heading</h1>
<h4>, <h5>, <h6>) smallest).
<p> Defines a paragraph. <p>This is a paragraph of text.</p>
<ol> Ordered (numbered) list. <ol type="A"> </ol>
Types:
1 (gives 1, 2, 3 …)
A (gives A, B, C…)
a (gives a, b, c …)
i (gives i, ii, iii, iv…)
I (gives I, II, III …)
<ul> Unordered (bulleted) list. <ul type="circle"></ul>
Types:
disc – solid circle (default)
circle – hollow circle
square – solid square
<li> List item inside <ol> or <ul>. <li>First item</li>
<dl> Description list container. <dl></dl>
<dt> Term in a description list. <dt>HTML</dt>
`<img> Displays an image. <img src="image.jpg" alt="Sample Image"
width="200" height="150">
<audio> Embeds an audio player. <audio controls>
<source src="audio.mp3"
type="audio/mpeg">
</audio>
<video> Embeds a video player. <video width="320" height="240" controls>
<source src="video.mp4"
type="video/mp4">
</video>
<link> Links external resources like CSS, <a href="https://example.com">Visit
websites, videos etc. Example Site</a>
<iframe> Embeds another webpage inside the <iframe src="https://www.example.com"
current page. width="300" height="200"></iframe>
<button> Creates a clickable button. <button>Click Me</button>
CODE:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HTML Tags Example</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1>Welcome to HTML Basics</h1>
<p>This page demonstrates basic HTML tags with examples.</p>
<h2>Ordered List (with type)</h2>
<ol type="A">
<li>First Item</li>
<li>Second Item</li>
<li>Third Item</li>
</ol>
<h2>Unordered List (with type)</h2>
<ul type="circle">
<li>Apple</li>
<li>Banana</li>
<li>Cherry</li>
</ul>
<h2>Description List</h2>
<dl>
<dt>HTML</dt>
<dd>HyperText Markup Language</dd>
<dt>CSS</dt>
<dd>Cascading Style Sheets</dd>
</dl>
<h2>Image Example</h2>
<img src="image.jpg" alt="Sample Image" width="200" height="150">
<h2>Audio Example</h2>
<audio controls>
<source src="audio.mp3" type="audio/mpeg">
</audio>
<h2>Video Example</h2>
<video controls width="320" height="240">
<source src="video.mp4" type="video/mp4">
</video>
<h2>Hyperlink Example</h2>
<a href="https://example.com">Visit Example Site</a>
<h2>Iframe Example</h2>
<iframe src="https://example.com" width="400" height="300"></iframe>
<h2>Button Example</h2>
<button>Click Me</button>
</body>
</html>
