HTML

HTML



1.Design a simple and attractive webpage for Kerala Tourism. It should contain features like background image, heading, text formatting and font tags, images, etc.
HTML Code:-
<HTML>
<HEAD>
<TITLE>Kerala Tourism</TITLE>
</HEAD>
<BODY BACKGROUND="kerala.jpg">
<CENTER>
<H1>Kerala Tourism</H1>
<IMG SRC="godsown.png" height="100" width="140"> <BR>
<FONT FACE="ARIAL" COLOR="BLUE" size="5">
Excellent Climate <BR>
Backwater Tourism <BR>
Hillstations <BR>
Cultural Specialities <BR>
Ethnic Food <BR>
</FONT>
<IMG SRC="kathakali.jpg" height="350" width="340">
</CENTER>
<P ALIGN="JUSTIFY">
<FONT FACE="SANS SERIF" COLOR="#00FFFF" size="5">
<B>
<I>
Kerala, a state situated on the tropical Malabar Coast of southwestern India,
is one of the most popular tourist destinations in the country.
Named as one of the ten paradises of the world by National Geographic Traveler,
Kerala is famous especially for its ecotourism initiatives and beautiful backwaters.
</I>
</B>
</FONT>
</P>
</BODY>
</HTML>


OUTPUT
























2. Design a webpage as shown below using appropriate list tags.
List of Nobel Laureates from India
Rabindra Nath Tagore
He was the first to get Nobel prize from India. He received prize in literature in 1921. He got Nobel Prize for his collection of poems "Gitanjali".
C V Raman
He got Nobel for Physics in 1930. He received nobel prize for his contribution called Raman Effect.
Mother Teresa
Mother Teresa who founded Missionaries of Charity which is active in more than 100 countries received Nobel Prize in 1979.
Amartya sen
Amartya sen was awarded nobel prize in 1998 in economics he has made constribution to welfare economics social choice theory etc.
Kailash Satyarthi
He is a child right activist who founded "Bachpan Bachao Andolan" in 1980. He shared nobel prize for peace in 2014.


HTML Code:
<html>
<head>
<title>Definition list</title></head>
<body>
<h1 align="center">List of Nobel Laureates from India</h1>
<font size=+ 1>
<dl>
<dt> <b>Rabindra Nath Tagore</b></dt>
<dd>He was the first to get Nobel prize from India.
He received prize in literature in 1921.
He got Nobel Prize for his collection of poems "Gitanjali".
</dd>
<dt><b>C V Raman</b></dt>
<dd>He got Nobel for Physics in 1930.
He received nobel prize for his contribution called Raman Effect.
</dd>
<dt>Mother Teresa</dt>
<dd>Mother Teresa who founded Missionaries of Charity which is active in
more than 100 countries received Nobel Prize in 1979.
</dd>
<dt><b>Amartya sen</b></dt>
<dd>
Amartya sen was awarded nobel prize in 1998 in economics he has
made constribution to welfare economics social choice theory etc.
</dd>
<dt><b>Kailash Satyarthi</b></dt>
<dd>He is a child right activist who founded "Bachpan Bachao Andolan" in 1980. He shared nobel prize for peace in 2014.
</dd>
</dl>
</body>
</html>
OUTPUT


















3. Design a webpage showing tourist destinations in kerala as shown below.

Department of Tourism

Government of Kerala


Tourist destinations in Kerala
  1. Beaches
    1. Kovalam
    2. Muzhuppilangad
    3. Kappad
  2. Hill Stations
    1. Munnar
    2. Wayanad
    3. Gavi
  1. Wildlife
    1. Iravikulam
    2. Muthanga
    3. Kadalundi


HTML code:-
<html>
<head>
<title>Tourist destination of Kerala</title></head>
<body>
<h3 align="center">Department of Tourism</h1>
<h3 align="center">Government of Kerala</h3>
<br>
<b>Tourist destinations in Kerala</b>
<ol>
<li>Beaches
<ol type="a">
<li>Kovalam
<li>Muzhuppilangad
<li>Kappad
</ol>
<li>Hill Stations
<ol type="i" >
<li>Munnar
<li>Wayanad
<li>Gavi
</ol>
<li>Wildlife
<ol type="a">
<li>Iravikulam
<li>Muthanga
<li>Kadalundi
</ol>
</ol>
</body>
</html>










OUTPUT











4. Design the following table using HTML
Class
Strength
Science
Commerce
Humanities
Plus One
49
50
48
Plus Two
50
50
49




HTML Code:
<html>
<head>
<title>class</title>
</head>
<body>
<table border="1" cellpadding=10>
<tr align="center">
<th rowspan="2">Class</th>
<th colspan="3">Strength</th>
</tr>
<tr align="center">
<th>Science</th>
<th>Commerce</th>
<th>Humanities</th>
</tr>
<tr align="center">
<th>Plus One</th>
<td>49</td>
<td>50</td>
<td>48</td>
</tr>
<tr align="center">
<th>Plus Two</th>
<td>50</td>
<td>50</td>
<td>49</td>
</tr>
</table>
</body>
</html>














OUTPUT


























5. Design a web page containing a table as shown below:- Terrestrial Planets (Source:NASA)
Planet
Day Length
(In Earth hours)
Year Length
(In Earth days)
Mercury
1408
88
Venus
5832
224.7
Earth
24
365.26
Mars
25
687
HTML Code:
<html>
<head>
<title>class</title>
</head>
<body>
<center>
<table border="1" cellpadding="10" cellspacing="1">
<caption>Terrestrial Planets (Source:NASA)</caption></center>
<tr align="center">
<th>Planet</th>
<th>Day Length<BR>(In Earth hours)</th>
<th>Year Length<BR>(In Earth days) </th>
</tr>
<tr align="center">
<td>Mercury</td>
<td>1408</td>
<td>88</td>
</tr>
<tr align="center">
<td>Venus</td>
<td>5832</td>
<td>224.7</td>
</tr>
<tr align="center">
<td>Earth</td>
<td>24</td>
<td>365.26</td>
</tr>
<tr align="center">
<td>Mars</td>
<td>25</td>
<td>687</td>
</tr>
</table>
</body>
</html>
OUTPUT




5 comments: