:
What is HTML?
• HTML (HyperText Markup Language) is the standard
language used to create web pages.
• It tells the browser how to structure and display content
like text, images, and links on a webpage.
Key Features of HTML
1. HTML is not a programming language – it is a markup
language.
2. HTML uses tags to structure content.
3. Tags are enclosed within angle brackets < >.
4. Most tags have an opening tag (e.g., <p>) and a closing
tag (e.g., </p>).
Basic Structure of an HTML Document
Every HTML document follows this basic structure:
<!DOCTYPE html>
<html>
<head>
<title>My First Webpage</title>
</head>
<body>
<h1>Welcome to HTML</h1>
<p>This is my first paragraph.</p>
</body>
</html>
Explanation of the Structure:
1. <!DOCTYPE html>: Declares the document type
(HTML5).
2. <html>: The root tag that contains the entire HTML
content.
3. <head>: Contains metadata about the document (e.g.,
title).
4. <title>: Defines the title of the webpage (shown on the
browser tab).
5. <body>: Contains the main content visible on the
webpage.
Common HTML Tags
Tag Purpose Example
Defines
<h1> to headings
<h1>Heading 1</h1>
<h6> (<h1> is the
largest).
Defines a
<p> <p>This is a paragraph.</p>
paragraph.
Tag Purpose Example
Creates a <a href="https://example.com">Click
<a>
hyperlink. here</a>
Displays an <img src="image.jpg"
<img>
image. alt="Description">
Creates an
unordered <ul><li>Item 1</li><li>Item
<ul>
(bulleted) 2</li></ul>
list.
Creates an
ordered <ol><li>Step 1</li><li>Step
<ol>
(numbered) 2</li></ol>
list.
Creates a
<table> <table><tr><td>Cell</td></tr></table>
table.
Inserts a line
<br> break (no <p>Line 1<br>Line 2</p>
closing tag).
Defines a
<div> division or <div>Content goes here</div>
container.
Attributes in HTML
Attributes provide additional information about elements.
They are written inside the opening tag.
Example:
<a href="https://example.com" target="_blank">Visit
Example</a>
• href: Specifies the URL for the link.
• target="_blank": Opens the link in a new tab.
How HTML is Displayed
• Web browsers like Chrome, Firefox, and Edge interpret
HTML and display the structured content.
• HTML is not case-sensitive, but it is a good practice to
use lowercase for tags.
Practice Example
<!DOCTYPE html>
<html>
<head>
<title>My Web Page</title>
</head>
<body>
<h1>Hello, World!</h1>
<p>HTML is fun to learn.</p>
<img src="https://via.placeholder.com/150" alt="Sample
Image">
<a href="https://google.com" target="_blank">Search on
Google</a>
</body>
</html>
How to Practice HTML
1. Use a simple text editor like Notepad or a code editor
like VS Code.
2. Save the file with a .html extension (e.g., example.html).
3. Open the file in a browser to view the webpage.