Scribd
Upload
26 views

Practical File Final (1)

This practical file on HTML includes various programs demonstrating the use of HTML tags and structures for creating web pages. It covers topics such as basic tags, webpage design for a college, family information, and favorite leaders, along with examples of color effects and tables. The document serves as a comprehensive guide for understanding and applying HTML in web development.

Uploaded by

sonalsapra123
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
26 views

Practical File Final (1)

This practical file on HTML includes various programs demonstrating the use of HTML tags and structures for creating web pages. It covers topics such as basic tags, webpage design for a college, family information, and favorite leaders, along with examples of color effects and tables. The document serves as a comprehensive guide for understanding and applying HTML in web development.

Uploaded by

sonalsapra123
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/ 29

Practical File

on
HTML

Submitted To: Submitted By:


Mrs. Pooja Bansal Arzoo
BBA 3rd Year
Roll No.- 12
Index
S No. Program Name Page No. Remarks

1. Introduction to HTML 3-4

2. Write a program of Basic Tags 5-6


in HTML

3. Write a program to design a 7-9


webpage to display your
college
4. Write a program to design 10-12
a webpage using List

5. Write a program to design a 13-14


webpage using Color Effects

6. Write a program to show Time Table 15-19

7. Write a program to display your 20-22


family information with
background and other formatting
8. Write a program to design a 23-25
webpage of your favorite
leader
9. Write a program to show the link 26-27
of images

10. Write a program to show 28-29


frameset tag and frame tag
Introduction to HTML
HTML, or Hyper Text Markup Language, is the standard
language used to create and design the structure of web
pages. HTML provides a way to structure content using
tags (or elements) that tell the web browser how to
display text, images, links, lists, tables, and other media
on a webpage.

Key Elements of HTML:


1. Tags and Elements: HTML consists of tags like <html>,
<head>, <body>, <h1>, <p>, etc. Each tag serves a specific
purpose. Tags are typically paired (opening and closing,
like <p> and </p> for paragraphs).

2. Attributes: Tags can have attributes that provide


additional information, like href in <a href="URL">
for links or src in <img src="URL"> for images.

3. HTML Document Structure:


- <html>: The root element.
- <head>: Contains metadata, title, and links
to stylesheets.
- <body>: Contains the content displayed to the user.
Example of Basic HTML Code:

<html>
<head>
<title>My First Webpage</title>
</head>
<body>
<h1>Welcome to My Webpage</h1>
<p>This is a simple paragraph of text.</p>
</body>
</html>
HTML is the foundation of all web pages, working
alongside CSS (for styling) and JavaScript (for interactivity)
to create a full web experience.
Write a program of Basic HTML

<html>
<head>
<title>Basic HTML Tags</title>
</head>
<body>
<h1>Welcome to My Page</h1>
<h2>About This Page</h2>
<p>This page demonstrates some basic HTML tags.
<ul>
<li>HTML is a markup language.</li>
<li>It structures content on the web.</li>
</ul>
<p>Thank you for visiting!</p>
</body>
</html>
Output
Write a program to design a webpage to
display your college

<html>
<head>
<title>MY COLLEGE</title>
</head>
<body>
<h1 align=center><u>All About My College</u></h1>
<hr>
<h2 align=right>Date: Nov 06,2024</h2>
<hr width=50% size=10>
<p><strong>My College</srtong> is established in 1073,
currently college offers a total of 12 Degrees and 20
Courses<em> are at my college</em>. My subject lecturer is
<b>Mrs.Pooja Bansal</b>.There are 14 students in my
class</p>
<p align=center>Here are some facts about My College</p>
<pre>
Date of Establishment: 1973
Courses 20
Class Rooms 30
Teachers 50
Address :Jhajjar Road,NH 71, Jagdish
Colony, Rohtak, Haryana 124001
</pre>
<hr nonshade>
<p align=cetrer>If you wish to contact, please contact at the
following phone number<blink> 01262-253848 </blink></p>

</body>
</html>
Output
Write a program to design a web page
using list

<html>
<head>
<title>Courses Offered</title>
</head>
<body>

<h1>Courses Offered</h1>

<ol>
<li> Undergraduate Courses (U.G)</li>
<ul>
<li>B.A (Bachelor of Arts)</li>
<li>B.Com (Bachelor of Commerce)</li>
<li>BBA (Bachelor of Business Administration)</li>
<li>BCA (Bachelor of Computer Applications)</li>
</ul>

<li>Postgraduate Courses (P.G)</li>


<ul>
<li>M.Com (Master of Commerce)</li>
<li>M.A (Political Science)</li>
<li>M.A (History)</li>
<li>M.A (English)</li>
<li>M.A (Hindi)</li>
<li>M.Sc (Mathematics)</li>
</ul>

</body>
</html>
Output
Write a program to design a web page
using color effects
<html>
<head>
<title>Color</title>
</head>
<body bgcolor=lightgray text=red>
Adding colors to webpage could achieve certain visual effects
and make them more attractive.
</body>
</html>
Output
Write a program to show Time Table
<html>
<head>
<title>Time Table</title>
</head>
<body>
<table border="1" Cellpadding="10" cellspacing="0" >
<tr>
<th>Day/Time </th>
<th>I(9-10) </th>
<th>II(10-11) </th>
<th>III(11-12) </th>
<th>IV(12-13) </th>
<th>V(13-14) </th>
</tr>
<tr>
<th>Monday </th>
<td>C.Law (Dr. Renu Jain) R.19 </td>
<td>IBE (Dr. Prativindya) R.18 </td>
<td> </td>
<td>Pro. Mgt (Dr. Nidhi) R.19 </td>
<td>IT (Ms. Monila Jain) R.17 </td>
</tr>
<tr>
<th>Tuesday </th>
<td>C.Law (Dr. Renu Jain) R.19 </td>
<td>IBE (Dr. Prativindya) R.18 </td>
<td> </td>
<td>Pro. Mgt (Dr. Nidhi) R.19 </td>
<td>IT (Ms. Monila Jain) R.17 </td>
</tr>

<tr>
<th>Wednesday </th>
<td>Per.Devel. (Dr. Nidhi) R.19 </td>
<td>IBE (Dr. Prativindya) R.18 </td>
<td> </td>
<td>Cyber Sec. (Dr. Prativindya) R.19 </td>
<td>Pro. Mgt (Dr. Nidhi) R.17 </td>
</tr>
<tr>
<th>Thursday </th>
<td>Per.Devel. (Dr. Nidhi) R.19 </td>
<td>IBE (Dr. Prativindya) R.18 </td>
<td> </td>
<td>Cyber Sec. (Dr. Prativindya) R.19 </td>
<td>Pro. Mgt (Dr. Nidhi) R.17 </td>
</tr>

<tr>
<th>Friday </th>
<td>Per.Devel. (Dr. Nidhi) R.19 </td>
<td> IT Lab (Ms. Pooja Bansal) </td>
<td>C.Law (Dr. Renu Jain) R.18 </td>
<td> </td>
<td>Cyber Sec. (Dr. Renu Jain) R.17 </td>
</tr>
<tr>
<th>Saturday </th>
<td>Per.Devel. (Dr. Nidhi) R.19 </td>
<td> IT Lab (Ms. Pooja Bansal) </td>
<td>C.Law (Dr. Renu Jain) R.18 </td>
<td> </td>
<td>Cyber Sec. (Dr. Renu Jain) R.17 </td>
</tr>
</table>
</body>
</html>
Output
Write a program to display your family
information with background and
other formatting
<html>

<head>
<title>My Family</title>
</head>
<body background="C:\Users\Lenovo\OneDrive\Desktop\
background.j pg">
<h1 align=center>Together We Stand: A Portrait of My Family
</h1>
<hr>
<p>
My family is the foundation of my life, a close-knit and
supportive unit where every member plays a vital role. My
father is a successful businessman, whose hard work and
dedication provide for our family and inspire me daily. My
mother, a nurturing housewife, is the heart of our home—her
love and care create a warm and welcoming environment for all
of us. I am fortunate to have two elder sisters, both of whom are
married and have children. They each have two kids, who bring
immense joy and laughter to our lives. Lastly, I have a younger
brother, full of energy and curiosity, who adds a sense of fun
and
mischief to our family dynamic. Together, we share love,
laughter, and a strong bond that makes our family truly special.
</p>
<center>
<img src="C:\Users\Lenovo\OneDrive\Desktop\family.avif">
</center>
</body>
</html>
Output
Write a program to design a web page of
our favorite leader
<html>

<head>
<title>My Family</title>
</head>
<body background="C:\Users\Lenovo\OneDrive\Desktop\
bhagat singh.jpg" height="800" width="1500" text=white>
<h1 align=center>"In the Footsteps of Bhagat Singh: A Leader
Who Inspired Generations"</h1>
<hr>

<p>
Bhagat Singh’s life and legacy continue to resonate deeply, not
just as a revolutionary figure but as a symbol of unwavering
courage, selfless sacrifice, and visionary leadership. His bold
actions, fearless defiance against colonial rule, and commitment
to the cause of India’s freedom inspired an entire generation to
rise against oppression. At just 23 years old, Bhagat Singh
became an icon, showing that age was no barrier to making a
lasting impact. His deep understanding of the socio-political
landscape and his determination to fight for justice transformed
him into a beacon of hope for countless young minds. Even
decades after his martyrdom, his spirit lives on, urging us to
challenge injustice, stand up for the oppressed, and pursue the
greater good with conviction. Following in his footsteps means
not only honoring his sacrifices but also embracing his vision of
a free, equal, and just society—values that continue to inspire
people around the world today.
</p>
</body>
</html>
Output
Write a program to show the link of images

<html>
<head>
<title>link</title>
</head>
<body>
<h1 align=center>Images</h1>
<hr>
<h2>Click on the link to open image</h2>
<a href="C:\Users\Lenovo\OneDrive\Desktop\family.avif">C:\
User s\Lenovo\OneDrive\Desktop\family.avif </a> <br>
<a href="C:\Users\Lenovo\OneDrive\Desktop\bhagat
singh.jpg"> Bhagat Singh </a><br>
<a href="C:\Users\Lenovo\OneDrive\Desktop\
background.jpg">Cli ck here to Open </a></body>
</html>
Output
Write a program to show frameset tag
and frame tag

<html>
<head>
<title>Frame Set</title>
</head>
<frameset cols="35,30,35">
<frame src="C:\Users\Lenovo\OneDrive\Desktop\
page1.html">
<frame src="C:\Users\Lenovo\OneDrive\Desktop\
page3.html">
<frame src="C:\Users\Lenovo\OneDrive\Desktop\
page2.html">
</frameset>
</html>
Output

You might also like