Scribd
Upload
2 views27 pages

231 Fa 04274

The document outlines various HTML tags and their uses, structured around multiple aims, each demonstrating a different HTML feature such as headings, quotations, text formatting, and forms. It includes source code examples for each aim, showcasing how HTML is utilized to create and design webpages. The document serves as a comprehensive guide for understanding and implementing HTML elements in web development.

Uploaded by

varaprasadsetty2005
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
2 views27 pages

231 Fa 04274

The document outlines various HTML tags and their uses, structured around multiple aims, each demonstrating a different HTML feature such as headings, quotations, text formatting, and forms. It includes source code examples for each aim, showcasing how HTML is utilized to create and design webpages. The document serves as a comprehensive guide for understanding and implementing HTML elements in web development.

Uploaded by

varaprasadsetty2005
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 27

HTML (HyperText Markup Language) TAGS

NAME: Grandhe Thanuja

Reg no: 231FA04274

SECTION: 2H

AIM 1: HEADING TAG

SOURCE CODE:

<html>

<head> Heading tags </head>

<body>

<h1>HTML (HyperText Markup Language) is the standard language used to create and design
webpages. It provides the basic structure of a website, enabling developers to organize
content such as text, images, videos, and links. </h1>

<h2> HTML uses elements, represented by tags enclosed in angle brackets (e.g., <p> for
paragraphs or <img> for images), to define the roles and appearance of content on a
webpage.</h2>

<h3> HTML is not a programming language but a markup language, meaning it structures
content rather than performing computations.</h3>

<h4>It works alongside CSS (for styling) and JavaScript (for interactivity)to create dynamic
and visually appealing websites. Modern HTML5 introduces advanced features like
multimedia embedding, semantic elements (e.g., header, article), and APIs for offline storage
and location tracking.</h4>

<h5>(e.g., header, article), and APIs for offline storage and location tracking.

HTML is the foundation of web development, making it an essential skill for anyone
interested in creating or managing online content. </h5>

<h6> HTML DisplayYou cannot be sure how HTML will be displayed.Large or small screens,
and resized windows will create different results. </h6>
</body>

</html>

OUTPUT:

AIM 2: QU0TATION TAG

SOURCE CODE:

<html>

<head>

<title> quotation tag </title>

</head>

<body>

<p> <q>HTML (Hyper Text Markup Language) </q> is the standard language used to create
and design webpages. It provides the basic structure of a website, enabling developers to
organize content such as text, images, videos, and links. </p>

</body>

</html>

OUPUT:
AIM 3: TEXT FORMATTED TAG

SOURCE CODE:

<html>

<head>

<title> Text formatted tag</title>

</head>

<body>

<p><strong> HTML uses elements, represented by tags enclosed in angle brackets (e.g., <p>
for paragraphs or <img> for images), to define the roles and appearance of content on a
webpage </strong></p>

<p><em> HTML uses elements, represented by tags enclosed in angle brackets (e.g., <p> for
paragraphs or <img> for images), to define the roles and appearance of content on a
webpage</em></p>

<p><u> HTML uses elements, represented by tags enclosed in angle brackets (e.g., <p> for
paragraphs or <img> for images), to define the roles and appearance of content on a
webpage </u></p>

<p><del> HTML uses elements, represented by tags enclosed in angle brackets (e.g., <p> for
paragraphs or <img> for images), to define the roles and appearance of content on a
webpage </del></p>

<p><s> HTML uses elements, represented by tags enclosed in angle brackets (e.g., <p> for
paragraphs or <img> for images), to define the roles and appearance of content on a
webpage </s></p>

</body>

</html>

OUTPUT:
AIM 4: MARK

SOURCE CODE:

<html>

<head>

<title> MARK</title>

</head>

<body>

<p><mark> HTML uses elements, represented by tags enclosed in angle brackets (e.g., <p>
for paragraphs or <img> for images), to define the roles and appearance of content on a
webpage </ mark></p>

</body>

</html>

OUTPUT:

AIM 5: CENTER

SOURCE CODE:

<html>

<head>

<title> center</title>
</head>

<body>

<p><center>HTML stands for Hypertext markup language</center></p>

</body>

</html>

OUTPUT:

AIM 6: SMALL

SOURCE CODE:

<html>

<head>

<title>small</title>

</head>

<body>

<p><small>Initiate and organise internal and external meetings, write follow-up reports etc.,
act as department facilitator to co-ordinate within team and with other departments when
needed</small></p>

</body>

</html>

OUTPUT:

AIM 7: PARAGRAPH

SOURCE CODE:

<html>

<head>
<title>small</title>

</head>

<body>

<p>

Taj Mahal is a white marble mausoleum built by Mughal Emperor, Shah Jahan in the year
1653.Taj Mahal is built in the loving memory of Mumtaz Mahal, wife of Emperor Shah Jahan.
Taj Mahal is built by 20000 artisans in a span of 22 years. Taj Mahal is located in Agra near
the river Yamuna. Taj Mahal has been chosen as the Seven Wonders of the World. </P>

<p>Taj Mahal is a white marble mausoleum built by Mughal Emperor, Shah Jahan in the year
1653.

Taj Mahal is built in the loving memory of Mumtaz Mahal, wife of Emperor Shah Jahan. </p>

<p>Taj Mahal is built by 20000 artisans in a span of 22 years.

Taj Mahal is located in Agra near the river Yamuna.

Taj Mahal has been chosen as the Seven Wonders of the World. </p>

<p>Taj Mahal is a white marble mausoleum built by Mughal Emperor, Shah Jahan in the year
1653. </p>

<p>Taj Mahal is built in the loving memory of Mumtaz Mahal, wife of Emperor Shah Jahan.
</p>

<p>Taj Mahal is built by 20000 artisans in a span of 22 years. </p>

<p>Taj Mahal is located in Agra near the river Yamuna. </p>

<p>Taj Mahal has been chosen as the Seven Wonders of the World. </P>

</body>

</html>

OUTPUT:
AIM 8: SUBSCRIPT

SOURCE CODE:

<html>

<head>

<title>subscript</title>

</head>

<body>

<h2>1. Chemical Formulas</h2>

<p>Some common chemical compounds:</p>

<ul>

<li>Ammonia: NH<sub>3</sub></li>

<li>Glucose: C<sub>6</sub>H<sub>12</sub>O<sub>6</sub></li>

<li>Ozone: O<sub>3</sub></li>

</ul>

<h2>2. Mathematical Notation</h2>

<p>Examples of mathematical expressions:</p>

<ul>

<li>Quadratic Equation: x<sub>1</sub>, x<sub>2</sub> = (-b ± √(b<sup>2</sup> -


4ac)) / 2a</li>

<li>n-th term in a sequence: a<sub>n</sub> = a<sub>1</sub> + (n-1)d</li>


</ul>

<p> H <sub> 2 </sub> SO <sub> 4 </sub> </p>

</body>

</html>

OUTPUT:

AIM 9: SUPER SCRIPT

SOURCE CODE:

<html>

<head>

<title>superscript</title>

</head>

<body>

<h2>1. Mathematical Expressions</h2>

<p class="math">Area of a square: A = s<sup>2</sup></p>

<p class="math">Einstein's formula: E = mc<sup>2</sup></p>

<p class="math">x raised to the power of y: x<sup>y</sup></p>

<h2>2. Chemical Notations</h2>

<p>Chemical notation for ions:</p>

<p>Calcium ion: Ca<sup>2+</sup></p>

<p>Sulfate ion: SO<sub>4</sub><sup>2-</sup></p>

</body>
</html>

OUTPUT:

AIM 10: BREAK ROW

SOURCE CODE:

<html>

<head>

<title>break row</title>

</head>

<body>

<p>HTML (HyperText Markup Language) is the standard language used to create and design
webpages. <br> It provides the basic structure of a website, enabling developers to organize
content such as text, images, videos, and links</p>

</body>

</html>

OUTPUT:

AIM 11: MARQUE

SOURCE CODE:

<html>

<head>
<title>marque</title>

</head>

<body>

<marquee direction = "left" bgcolor="yellow"> HTML (HyperText Markup Language) is the


standard language used to create and design webpages </marquee><br>

<marquee direction="up" bgcolor="green"> HTML (HyperText Markup Language) is the


standard language used to create and design webpages </marquee><br>

<marquee direction="down" bgcolor="pink"> HTML (HyperText Markup Language) is the


standard language used to create and design webpages </marquee><br>

<marquee direction="right" bgcolor="blue"> HTML (HyperText Markup Language) is the


standard language used to create and design webpages </marquee><br>

<marquee behavior="alternate" bgcolor="Red"> HTML (HyperText Markup Language) is the


standard language used to create and design webpages </marquee><br>

</body>

</html>

OUTPUT:

AIM 12: HORIZONTAL RULE TAG

SOURCE CODE:

<html>

<head>

<title>horizontal rule tag</title>

</head>

<body>

<p> HTML (Hyper Text Markup Language) is the standard language used to create and design
webpages. <hr> It provides the basic structure of a website, enabling developers to organize
content such as text, images, videos, and links</p>
</body>

</html>

OUTPUT:

AIM 13: PREFORMATTED TEXT

SOURCE CODE:

<html>

<head>

<title>preformatted text</title>

</head>

<body>

<pre> HTML (Hyper Text Markup Language) is the standard language used to create and
design webpages. It provides the basic structure of a website, enabling developers to
organize content such as text, images, videos, and links</pre>

</body>

</html>

OUTPUT:

AIM 14: ANCHOR

CODE:

<html>

<head>

<title>anchor</title>

</head>
<body>

<a href = "https://www.youtube.com/"> click here </a>

</body>

</html>

OUTPUT:

AIM 15: TABLE

CODE:

<html>

<head>

<title>table</title>

</head>

<body>

<!-- Table -->

<h2>Premium Product Pricing</h2>

<table border="1">

<tr>

<th>Product</th>

<th>Price</th>

<th>Availability</th>

</tr>

<tr>

<td>Laptop</td>

<td>1,00,000/-</td>

<td>Available</td>

</tr>
<tr>

<td>Fridge</td>

<td>80,000/-</td>

<td>Out of Stock</td>

</tr>

<tr>

<td>Washing Machine</td>

<td>40,000/-</td>

<td>5 Left</td>

</tr>

<tr>

<td>Air Conditioner</td>

<td>60,000/-</td>

<td>Available</td>

</tr>

</table>

</body>

</html>

OUTPUT:

AIM 16: LISTS

CODE:

<html>

<head>
<title>lists</title>

</head>

<body>

<!-- Lists: Unordered, Ordered, and Nested -->

<h2>Our Services</h2>

<ul style="list-style-type:disc;">

<li>Web Development</li>

<li>SEO Optimization</li>

<li>Content Creation

<ul style="list-style-type:Square;">

<li>Blog Posts</li>

<li>Articles</li>

<li>Social Media Posts</li>

</ul>

</li>

<li>Marketing Strategy</li>

</ul>

<h2>Steps for Getting Started</h2>

<ol type="I">

<li>Sign up for an account</li>

<li>Choose a service package</li>

<li>Make payment</li>

<li>Start receiving your services</li>

</ol>

</body>

</html>

OUTPUT:
AIM 17: BI-DIRECTIONAL

CODE:

<html>

<head>

<title>bidirectional</title>

</head>

<body>

<p> <bdo dir="rtl"> HTML (Hyper Text Markup Language) is the standard language used to
create and design webpages. It provides the basic structure of a website, enabling
developers to organize content such as text, images, videos, and links. </bdo></p>

<p> <bdo dir="ltr">HTML (Hyper Text Markup Language) is the standard language used to
create and design webpages. It provides the basic structure of a website, enabling
developers to organize content such as text, images, videos, and links</bdo></p>

</body>

</html>

OUTPUT:

AIM 18: ABBREVATION


CODE:

<html>

<head>

<title>abbrevation</title>

</head>

<body>

<abbr title = " Employee stock option "> ESOP </abbr>

</body>

</html>

OUTPUT:

AIM 19: IMAGE

CODE:

<html>

<head>

<title>image</title>

</head>

<body>

<p><img src="https://encrypted-tbn0.gstatic.com/images?
q=tbn:ANd9GcQzY15N5BIBUHO3MA_asc6wRhlYDhT-ry_DjQ&s" alt="Anime image"></p>

</body>

</html>

OUTPUT:
AIM 20: IFRAME

CODE:

<html>

<head>

<title>iframe</title>

<iframe

src="https://justflipacoin.com/"

width="1800"

height="1800"

frameborder="1">

</iframe>

</head>

<body>

</body>

</html>

OUTPUT:

AIM 21: FORMS

CODE:
<!DOCTYPE html>

<html lang="en">

<head>

<title>Travel Booking Form</title>

</head>

<body>

<h1>Travel Booking Form</h1>

<form action="#" method="post">

<!-- Personal Information -->

<fieldset>

<legend>Personal Information</legend>

<label for="name">Full Name:</label><br>

<input type="text" id="name" name="name" placeholder="Enter your full name"


required><br>

<label for="email">Email:</label><br>

<input type="email" id="email" name="email" placeholder="Enter your email


address" required><br><br>

<label for="phone">Phone Number:</label><br>

<input type="tel" id="phone" name="phone" placeholder="Enter your phone


number" required><br><br>

</fieldset>

<br>

<!-- Travel Details -->

<fieldset>

<legend>Travel Details</legend>

<label for="destination">Destination:</label><br>
<select id="destination" name="destination" required>

<option value="">--Select Destination--</option>

<option value="paris">Paris</option>

<option value="london">London</option>

<option value="new-york">New York</option>

<option value="tokyo">Tokyo</option>

</select><br><br>

<label for="travel-date">Travel Date:</label><br>

<input type="date" id="travel-date" name="travel_date" required><br><br>

<label for="preferences">Travel Preferences:</label><br>

<input type="checkbox" id="window-seat" name="preferences" value="window-


seat">

<label for="window-seat">Window Seat</label><br>

<input type="checkbox" id="aisle-seat" name="preferences" value="aisle-seat">

<label for="aisle-seat">Aisle Seat</label><br>

<input type="checkbox" id="vegan-meal" name="preferences" value="vegan-meal">

<label for="vegan-meal">Vegan Meal</label><br>

</fieldset>

<br>

<!-- Submit -->

<input type="submit" value="Submit">

</form>

</body>

</html>
OUTPUT:

AIM 22: BLOCK

CODE:

<html>

<head>

<title>BLOCK</title>

</head>

<body>

<h1>Agra</h1>

<h2>Taj Mahal is a white marble mausoleum built by Mughal Emperor, Shah Jahan in the
year 1653. </h2>

<h3>Taj Mahal is built in the loving memory of Mumtaz Mahal, wife of Emperor Shah Jahan.

Taj Mahal is built by 20000 artisans in a span of 22 years </h3>

</body>

</html>

OUTPUT:
AIM 23: INLINE

CODE:

<html>

<head>

<title>inline</title>

</head>

<body>

<b><u> Agra</u> </b>

<i>Taj Mahal is a white marble mausoleum built by Mughal Emperor, Shah Jahan in the year
1653</i>

<strike>Taj Mahal is built in the loving memory of Mumtaz Mahal, wife of Emperor Shah
Jahan Taj Mahal is built by 20000 artisans in a span of 22 years </strike>

</body>

</html>

OUTPUT:

AIM 24: SPAN

CODE:

<html>

<head>

<title>span</title>

</head>
<body>

<span style = "color:blue"> Taj Mahal is a white marble mausoleum built by Mughal
Emperor, Shah Jahan in the year 1653.Taj Mahal is built in the loving memory of Mumtaz
Mahal, wife of Emperor Shah Jahan Taj Mahal is built by 20000 artisans in a span of 22 years
Taj Mahal is located in Agra near the river Yamuna Taj Mahal has been chosen as the Seven
Wonders of the World </span>

</body>

</html>

OUTPUT:

AIM 25: DIV TAG

CODE:

<html>

<head> div tag </head>

<body>

<div style="background-color:yellow;">

<h2>HTML</h2>

<p>HTML (HyperText Markup Language) is the standard language used to create and design
the structure of web pages</p>

<p>HTML provides the foundational framework for web development by structuring


content on the web</p>

</div>

<div style="background-color:pink;">

<h2>CSS</h2>

<p>CSS (Cascading Style Sheets) is a style sheet language used to control the visual
appearance and layout of HTML elements on a webpage</p>

<p>CSS separates content (HTML) from presentation, making web pages easier to design,
maintain, and update</p>

</div>
<div style="background-color:green;">

<h2>JS</h2>

<p> JavaScript (JS) is a versatile programming language primarily used to add interactivity,
dynamic content, and advanced functionalities to websites</p>

<p>JavaScript enhances user experience by enabling dynamic interactions on websites</p>

</div>

</body>

</html>

OUTPUT:

AIM 26: SEMANTIC TAG

CODE:

<!DOCTYPE html>

<html lang="en">

<head>

<title>Semantic HTML Example</title>

</head>

<body>

<header>

<h1>Welcome to My Website</h1>

<p>This is the header section of the page.</p>


<p>HTML (HyperText Markup Language) is the standard language used to create and
structure content on the web. It is the backbone of web pages, providing the basic
framework for text, images, videos, links, and other elements that users interact with in a
browser. </p>

</header>

<nav>

<h2>Navigation</h2>

<ul>

<li><a href="https://www.facebook.com/">Facebook</a></li>

<li><a href="https://www.instagram.com/">Instagram</a></li>

<li><a href="https://x.com/">Twitter</a></li>

<li><a href="https://www.whatsapp.com/">Whatsapp</a></li>

</ul>

</nav>

<aside>

<h2>Additional Information</h2>

<p> HTML enhances accessibility and SEO. While static in nature, it integrates with CSS
for styling and JavaScript for interactivity, enabling responsive web design </p>

</aside>

<footer>

<p>In conclusion, HTML is the foundational language of the web, essential for creating
and structuring web pages. Its simplicity, platform independence, and support for modern
multimedia and semantic elements make it indispensable for web development. </p>

</footer>

</body>

</html>

OUTPUT:
AIM 27: VIDEO TAG

CODE:

<html>

<head>

<title> Video Tag </title>

</head>

<body>

<!-- Video Example -->

<h2>Video Player</h2>

<video width="600" controls>

<source src="sample-video.mp4" type="video/mp4">

<source src="sample-video.ogg" type="video/ogg">

Your browser does not support the video tag.

</video>

<p>This video player allows you to play a sample video.</p>

</body>

</html>

OUTPUT:
AIM 28: AUDIO TAG

CODE:

<html>

<head>

<title> Audio Tag </title>

</head>

<body>

<!-- Audio Example -->

<h2>Audio Player</h2>

<audio controls>

<source src="sample-audio.mp3" type="audio/mpeg">

<source src="sample-audio.ogg" type="audio/ogg">

Your browser does not support the audio element.

</audio>

<p>This audio player allows you to play a sample audio file.</p>

</body>

</html>

OUTPUT:

You might also like