You are on page 1of 31

NAME :Krutika Mishra

STD :FYIT(B)
ROLL NO:2235

PRACTICAL NO:1

AIM:Write a HTML program to perform.

i) Text-Formatting tags
CODE:
<html>
<head><h1>Text Formatting Tag</h></center>
<h1>HTML Program</h1>
<h2>HTML Program</h2>
<h3>HTML Program</h3>
<h4>HTML Program</h4>
<h5>HTML Program</h5>
<h6>HTML Program</h6>
</head>
<body>
<p>
<b>Bold Tag</b><br><br>
<strong>Strong Tag</strong><br><br>
<i>Italic Text</i><br><br>
<em>Emphasized Text</em><br><br>
20<sup>th</sup>November 2023<br><br>
H<sub>2</sub>O<br><br>
<u>Underline Tag</u><br><br>
<strike>Strike Tag</strike><br><br>
<small>Small Tag</small>
</p>
</body>
</html>
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

OUTPUT:
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

ii)List Element Tags

CODE:
<html><head>
<title><center>List Element tags:</center></title>
<body>
<ul><h3><li>List of Subjects</h3>
<ol Style="list-style-type:lower roman">
<li>Core Java
<li>Web Development
<li>Maths
<li>Soft Skills</ol>
<li><h3>Name of Teachers.</h3>
<ol Style="list-style-type:lower roman">
<li>Kanchan mam
<li>Jagruti mam
<li>Soly mam
<li>Surekha mam
</ol></ul>
<dl>
<dt> <h2>Definition List</h2></dt>
<h3>System software</h3>
<dd>These software programs are designed to run a computer's application programs
and hardware.</dd>
<dt><h3>Application software</h3></dt>
<dd>The most common type of software, application software is a computer software
package that performs a specific function for a user, or in some cases, for another
application.</dd>
</body>
</head></html>
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

OUTPUT:
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

iii)Image Tag

CODE:
<html><head>
<h1><left>Image Tag:</left></h1>
<body>
<img src="flowr.jpg" height=300 width=500 border=6 align="center"
alt="Computer Image">
<p><h3><i>The given image is of flowers that I love.</i></h3></p>
</body>
</head></html>

OUTPUT:
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

PRACTICAL NO:2

Aim: Write a HTML program to perform.


i) Simple table tag

CODE:
<html>
<body bgcolor=" orange">
<table border="2"height=200 width=200 align=center>
<caption><b><h1>EMPLOYEE TABLE </h1></b></caption><br>
<tr bgcolor="pink">
<th>Emp_ID </th>
<th>Emp_Name </th>
</tr>
<tr bgcolor="cyan">
<td>1</td>
<td>Sudha</td>
</tr>
<tr bgcolor="Blue">
<td>2</td>
<td>Raj</td>
</tr>
<tr bgcolor="pink">
<td>3</td>
<td>Kimee</td>
</tr>
<tr bgcolor="yellow">
<td>4</td>
<td>Krutika</td>
</tr>
<tr bgcolor="gray">
<td>5</td>
<td>Sanskar</td>
</tr>
</table>
</body>
</html>
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

OUTPUT:
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

ii) Table tag with rowspan and colspan attribute.

CODE:

<html>
<head><center>Table tag with rowspan and colspan</Head>
<body>
<table border="1">
<caption>Marksheet</caption>
<tr>
<th colspan="3">Result</th>
<th colspan="2">2023-24</th>
</tr>
<th></th>
<th>FYIT</th>
<th>Pass</th>
<th>Fail</th>
<th></th>
</tr>
<tr>
<td rowspan="3">Pillai College</td>
<td> Boys</td>
<td> 32</td>
<td> 03</td>
<td> 35</td>
</tr>
<tr>
<td>Girls</td>
<td>24</td>
<td>01</td>
<td>25</td>
</tr>
<tr>
<td>Total</td>
<td>56</td>
<td>04</td>
<td>60</td>
</tr>
</table>
</center>
</body>
</html>
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

OUTPUT:
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

iii)Hyperlinks

CODE:

<html>
<head><center><h1> HYPERLINKS</h1></center></head>
<body>
<h2>External Linking</h2>
<a href="Flower.html">Click here</a><br><br>
<h2>Internal Linking</h2>
<a href="#flo">Flowers</a>
<br>
<a href="#fru">Fruits</a>
<h2> Nature</h2>
<p>The words nature and nature are used for all the things that are normally not made by
humans. The word comes from the Latin natura meaning "birth". Nature includes many things
like weather, organisms, landforms, celestial bodies. Scientists study the way the parts of nature
work. Things that have been made by people are said to be man-made or called artifacts.

There are natural sciences that study different parts of nature, for example the science of
ecology is about plants and animals as a whole, while biology studies every type of living thing.

From one point of view, humans are a prime example of nature, and are the most widely studied
natural inhabitants of the planet earth. Humans interact with each other in their natural
environment on a day-to-day basis. Every part of nature – everything from the air outside to the
dirt on the ground – is interdependent. Medicine studies humans in health and sickness.

From another point of view, humans and nature can be said to be in conflict. People always use
natural resources. They cut down trees, mine ores, grow crops and manufacture things from
natural material. Fires, cars, and factories make a lot of smoke and harm many places. People
who like to leave nature unharmed and those who feel they need to use more of nature often
fight about what they should do. In the modern world, with many more people and many big
cities, these problems are becoming more serious.

Nature, in the broadest sense, means the physical world as a whole. This is the meaning that
physics, the study of nature (etymologically), takes.

A useful definition of natural is

"Happening or operating in accordance with the ordinary course of nature". Oxford Shorter
English Dictionary says the word in this sense is first found in 1477.</p>
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><b
r><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<a name="flo"> Flowers</a>
<p>A flower, also known as a bloom or blossom, is the reproductive structure found in flowering
plants (plants of the division Angiospermae). Flowers consist of a combination of vegetative
organs – sepals that enclose and protect the developing flower, petals that attract pollinators,
and reproductive organs that produce gametophytes, which in flowering plants produce
gametes. The male gametophytes, which produce sperm, are enclosed within pollen grains
produced in the anthers. The female gametophytes are contained within the ovules produced in
the carpels.

Most flowering plants depend on animals, such as bees, moths, and butterflies, to transfer their
pollen between different flowers, and have evolved to attract these pollinators by various
strategies, including brightly colored, conspicuous petals, attractive scents, and the production
of nectar, a food source for pollinators.[1] In this way, many flowering plants have co-evolved
with pollinators to be mutually dependent on services they provide to one another—in the plant's
case, a means of reproduction; in the pollinator's case, a source of food.[2]

When pollen from the anther of a flower is deposited on the stigma, this is called pollination.
Some flowers may self-pollinate, producing seed using pollen from a different flower of the same
plant, but others have mechanisms to prevent self-pollination and rely on cross-pollination,
when pollen is transferred from the anther of one flower to the stigma of another flower on a
different individual of the same species. Self-pollination happens in flowers where the stamen
and carpel mature at the same time, and are positioned so that the pollen can land on the
flower's stigma. This pollination does not require an investment from the plant to provide nectar
and pollen as food for pollinators.[3] Some flowers produce diaspores without fertilization
(parthenocarpy). After fertilization, the ovary of the flower develops into fruit containing seeds.

Flowers have long been appreciated by humans for their beauty and pleasant scents, and also
hold cultural significance as religious, ritual, or symbolic objects, or sources of medicine and
food.
</p>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><b
r><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<a name="fru"><Fruit></a>
<p>In botany, a fruit is the seed-bearing structure in flowering plants that is formed from the
ovary after flowering (see Fruit anatomy).

Fruits are the means by which flowering plants (also known as angiosperms) disseminate their
seeds. Edible fruits in particular have long propagated using the movements of humans and
other animals in a symbiotic relationship that is the means for seed dispersal for the one group
and nutrition for the other; in fact, humans and many other animals have become dependent on
fruits as a source of food.[1] Consequently, fruits account for a substantial fraction of the world's
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

agricultural output, and some (such as the apple and the pomegranate) have acquired extensive
cultural and symbolic meanings.

In common language usage, fruit normally means the seed-associated fleshy structures (or
produce) of plants that typically are sweet or sour and edible in the raw state, such as apples,
bananas, grapes, lemons, oranges, and strawberries. In botanical usage, the term fruit also
includes many structures that are not commonly called 'fruits' in everyday language, such as
nuts, bean pods, corn kernels, tomatoes, and wheat grains.
</p>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><b
r><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
</body>
</html>
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

OUTPUT:
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

PRACTICAL NO :3

AIM:Write a HTML program to perform


i)Navigation bar
CODE:
<html><head>
<h1>Navigation Bar</h1>
<style>
h1{
text-align:center;
color:green;
}
a{
text-decoration:none;
font-size:20px;
padding:8px;
}
.topnav{
background-color:pink;
padding:14px 20px;
margin:20px;
position:absolute;
}
</style></head>
<body vlink="brown" alink="yellow" align="center">
<div class="topnav">
<nav>
<a href="First program.html">First Program</a>
<a href="#IT">Course</a>
<a href=" list.html">About the teachers</a>
<a href="Result.html">Result</a>
</nav></div>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><b
r><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br>
<a name="IT">IT course</a>
<p><h4>
Information technology or IT courses involve the study of computers and
networks to process, clean,<br>
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

store and secure business information or any type of information meant for
professional purposes.<br>
Information Technology is a course that focuses on the regulation and security
of data using electronic devices and software.</h4></p>
<br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br>
</body></head></html>

OUTPUT:
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

ii) Multimedia (Audio & Video)


a) Audio tag

CODE:

<html>
<body bgcolor="yellow">
<h1><u>AUDIO TAG </u></h1>
<audio controls muted autoplay loop>
<Source src="audio.mp3" type="audio/mp3">
</audio>
</html>

OUTPUT:
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

b) Video tag

CODE:

<html><head>
<body>
<right><h1>Video File</h1></right>
<video controls muted loop autoplay height=300 width=300>
<source src="Video.mp4" type="Video/mp4">
</Video>
</body></head></html>

OUTPUT:
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

PRACTICAL NO:4

AIM:WRITE A HTML PROGRAM TO PERFORM .

1)CSS(cascading style sheet).

i)Inline CSS
CODE:
<html>
<head>Inline CSS</head>
<body>
<h1 style="text-align:center;color:blue;">Welcome to my Inline CSS</h1>
</body>
</html>

OUTPUT:
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

ii) Internal CSS


CODE:
<html><head>
<caption><h1>Internal CSS.</h1></caption>
<style>
h1{
text-align:left;
color:maroon;
}
a{
text-decoration:none;
}
</style></head>
<body>
<a href="Table.html"><h3> Click here</h3></a>
</body></html>

OUTPUT:
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

iii) External CSS


CODE:
#External.html
<html><head>
<h1>External CSS</h1>
<link ref="stylesheet" type="text/css" href="External.css"></head>
<body>
<a href="Table.html">Result</a>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
</body></html>

#External.css
<style>
h1{
text-align:left;
color:maroon;
}
a{
text-decoration:none;
padding: 20px;
}
</style>

OUTPUT:
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

2) Form

CODE:
<html>
<head>
<h1><center>Registration from</center></h1>
</head>
<body bgcolor="orange">
<form>
Enter your first name:<input type="text" name="fname"><br><br>
Enter your last name:<input type="text" name="lname"><br><br>
Enter your address:<textarea row="5" column="20">please enter the entire
address</textarea><br><br>
Gender:
<input type="radio" name="gender">Male
<input type="radio" name="gender">Female
<input type="radio" name="gender">Others<br><br>
Hobbies:<br>
<input type="checkbox" name="c1">Playing<br>
<input type="checkbox" name="c2">Reading<br>
<input type="checkbox" name="c3">Dancing<br>
select Batch:<select size="1">
<option>FYIT</option>
<option>SYIT</option>
<option>TYIT</option>
</select><br><br>
<fieldset>
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

<legend>Personal information</legend>
Email:<input type="text" name="email"><br><br>
Date of Birth:<input type="date" name"dob"><br><br>
Create password:<input type="password" name="pass"><br><br>
</fieldset><br><br>
<input type="submit" name="submit" value="Click Me">
</form>
</body>
</html>

OUTPUT:
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

PRACTICAL NO:5

AIM:Write a javascript program to perform operator .


i)Operators

CODE:
<html>
<head>
<script type="text/javascript">
var a=10;
var b=20;
var c="FYIT";
var br="<br>";
document.write("A is:", a);
document.write(br);
document.write("B is:", b);
document.write(br);
document.write("Hello is:", c);
document.write(br);
document.write("Assignment operator");
document.write("Addition is : ", a+=b);
document.write(br);
document.write("A is:", a);
document.write(br);
document.write("B is:", b);
document.write(br);
document.write("Subtraction is : ", a-=b);
document.write(br);
document.write("A is:", a);
document.write(br);
document.write("B is:", b);
document.write(br);
document.write("Multiplication is : ", a*=b);
document.write(br);document.write("A is:", a);
document.write(br);
document.write("B is:", b);
document.write(br);
document.write("Division is : ", a/=b);
document.write(br);
document.write("A is:", a);
document.write(br);
document.write("B is:", b);
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

document.write(br);
document.write(br);
document.write("String Operator");
document.write(br);
document.write(br);
var txt1="Have a";
var txt2="nice day!";
var txt3=txt1+" "+txt2;
document.write(txt3);
document.write(br);
document.write(br);
document.write("Types of Operator");
document.write(br);
document.write(br);
document.write(typeof 20);
document.write(br);
document.write(br);
document.write(typeof "Krutika");
document.write(br);
document.write(br);
document.write(typeof 23.58);
document.write(br);
document.write(br);

</script>
</head>
<body>
</body>
</html>
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

OUTPUT:
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

ii)FUNCTION
CODE:
<html>
<head>
<script type="text/javascript">
function display(len,wid)
{
var l=document.form1.len.value;
var b=document.form1.wid.value;
var area=l*b;
document.write("Area of Rectangle is:", area);
}
</script>
</head>
<body>
<form name="form1">
Enter length:<input type="text" name="len"/>
<br><br>
Enter width :<input type="text" name="wid"/>
<br><br>
<input type="button"value="Calculate Area" onclick="display(len,wid)"/>
</form>
</body>
</html>
NAME :Krutika Mishra
STD :FYIT(B)
ROLL NO:2235

OUTPUT:

You might also like