0% found this document useful (0 votes)
3 views

Basic_HTML_Tags_with_Examples

The document provides an overview of basic HTML tags along with examples for each tag. It includes essential tags such as <html>, <head>, <title>, <body>, and various content formatting tags like <h1> to <h6>, <p>, <a>, <img>, <ul>, <ol>, <table>, <form>, <marquee>, <div>, and <span>. Each tag is briefly explained with a corresponding code example to illustrate its usage.

Uploaded by

zeguslive
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
3 views

Basic_HTML_Tags_with_Examples

The document provides an overview of basic HTML tags along with examples for each tag. It includes essential tags such as <html>, <head>, <title>, <body>, and various content formatting tags like <h1> to <h6>, <p>, <a>, <img>, <ul>, <ol>, <table>, <form>, <marquee>, <div>, and <span>. Each tag is briefly explained with a corresponding code example to illustrate its usage.

Uploaded by

zeguslive
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 4

Basic HTML Tags with Examples

Index
S.No Tag Name
1 <html>
2 <head>
3 <title>
4 <body>
5 <h1 to h6>
6 <p>
7 <a>
8 <img>
9 <ul & li>
10 <ol>
11 <table>
12 <form>
13 <marquee>
14 <div>
15 <span>

<html> – Basic HTML Structure


The <html> tag wraps the entire HTML document and contains the <head> and <body>.

<!DOCTYPE html>
<html>
<head><title>My Page</title></head>
<body>Hello World</body>
</html>

<head> – Metadata Header


Contains meta info like title, links to CSS, etc.

<head>
<title>Sample Head</title>
</head>

<title> – Page Title Display


Sets the browser tab’s title.

<title>My Website</title>
<body> – Visible Content
All visible content like text, images, etc., goes inside <body>.

<body>
<h1>Welcome!</h1>
</body>

<h1> to <h6> – Headings Example


Defines headings, from largest (<h1>) to smallest (<h6>).

<h1>Main Heading</h1>
<h2>Subheading</h2>

<p> – Paragraph Example


Represents a block of text.

<p>This is a paragraph of text.</p>

<a> – Anchor Tag Example


Creates a clickable hyperlink using href attribute.

<a href="https://www.google.com">Go to Google</a>

<img> – Image Example


Embeds an image using src and alt attributes.

<img src="apple.jpg" alt="Apple Image" width="200">

<ul> & <li> – Bulleted List Example


Displays a bulleted list of items.

<ul>
<li>Pen</li>
<li>Pencil</li>
<li>Notebook</li>
</ul>

<ol> – Numbered List Example


Displays a numbered list of items.

<ol>
<li>Wake up</li>
<li>Brush teeth</li>
<li>Eat breakfast</li>
</ol>

<table> – Basic Table Example


Displays data in rows and columns using <tr>, <th>, and <td>.

<table border="1">
<tr>
<th>Name</th>
<th>Age</th>
</tr>
<tr>
<td>Alice</td>
<td>25</td>
</tr>
</table>

<form> – Simple Form


Used to collect user input via fields.

<form action="submit.php" method="post">


<label>Name:</label>
<input type="text" name="name">
<button type="submit">Submit</button>
</form>

<marquee> – Scrolling Text Example


Creates a scrolling (moving) text. Not recommended in modern HTML.

<marquee>Welcome to My Website!</marquee>

<div> – Block Container Example


Used to group block elements for layout and styling.

<div style="background-color:lightblue;">
<h2>Boxed Section</h2>
<p>Inside a div container.</p>
</div>

<span> – Inline Text Styling


Used for styling a part of text inline.
<p>This is <span style="color:red;">important</span> text.</p>

You might also like