Kerala HSS CS Lab HTML Sample Programs

Kerala HSS CS Lab
HTML Source Code and Output

By Farzeen | My Website
More Downloads | Project Website
01-TABLE01.HTML source
<!-Design a webpage containing tables as below

Terrestrial Planets (Source:NASA)
_______________________________________
| Planet
| Day length | Year length |
|
| (earth hrs) | (earth days)|
|__________|______________|_____________|
| Mercury | 1408
| 88
|
| Venus
| 5832
| 224.7
|
| Earth
| 24
| 365.26
|
| Mars
| 25
| 687
|
|__________|______________|_____________|
-->
<html>
<head> <title> Terrestrial Planets </title>
<body>
<H2> Terrestrial Planets (Source: Nasa) </H2>
<table border=1 cellspacing=5 cellpadding=10>
<tr>
<th>Planet</th>
<th>Day length (earth hrs) </th>
<th>Year length (earth days) </th>
</tr>
<tr>
<td>Mercury</td>
<td>1408</td>
<td>88</td>
</tr>
<tr>
<td>Venus</td>
<td>5832</td>
<td>224.7</td>
</tr>
<tr>
<td>Earth</td>
<td>24</td>
<td>365.26</td>
</tr>
<tr>
<td>Mars</td>
<td>25</td>
<td>687</td>
</tr>
</table>
</body>
</html>
01-TABLE01.HTML output
Terrestrial Planets (Source: Nasa)
Planet
Day length (earth hrs)
Year length (earth days)
Mercury
1408
88
Venus
5832
224.7
Earth
24
365.26
Mars
25
687
02-FORM01.HTML source
<!-Design an HTML form to accept the curriculum

vitae of a job applicant.
The
*
*
*
*
*
form should provide

Name
Address in multiple
Gender using option
Nationality using a
Hobbies using check
facility to accept:
lines
button
list box
boxes
The form should provide buttons to save and clear

the contents of text boxes
-->
<html>
<head> <title> Job Application </title> </head>
<body>

<style>
body { font-family: Fantasque Sans Mono, Ubuntu Mono, monospace; }
input[type=text] {margin-left:5em;height:2em; width: 15em;}
select {margin-left:0.5em;height:2em; width: 15em;}
input[type=submit], input[type=reset] { width:5em; height:2em;}
textarea
{ margin-left:9.5em;height:5em; width: 15em;}
br { height:2em; margin:0.8em;}
</style>
<h1> Job Application </h1>
<form name=form1 action=apply.php method=POST>
Name: <input type=text name=name> <br>
Address: <br>
<textarea name=name></textarea> <br>
Gender:
Male <input type=radio name=gender value=Male>
Female <input type=radio name=gender value=Female>
<br>
Nationality:
<select name=nationality>
<option>Indian</option>
<option>Pakistan</option>
<option>USA</option>
<option>UK</option>
<option>China</option>
<option>Other</option>
</select>
<br>
Hobbies: <br>
<input type=checkbox name=hobby_music> Music <br>
<input type=checkbox name=hobby_read> Read Books<br>
<input type=checkbox name=hobby_sports> Sports <br>
<input type=submit value=Submit> <input type=reset value=Clear>
</form>
</body>
</html>
02-FORM01.HTML output
Job Application
Name:
Address:
Gender: Male
Female
Nationality: Indian
Hobbies:
Music
Read Books
Sports
Submit
Clear
03-FORM02.HTML source
<!-Imagine that your school is hosting an inter-school IT fair. Design an HTML form for accepting registrations.
The form page should contain facility to enter:
* School name * User name * Password * Mobile phone no.
It should also contain a button for saving and clearing the details entered
-->
<html>
<head> <title> Registration - Interschool IT Fair </title> </head>
<body>

<style>
body {font-family: Fantasque Sans Mono, Ubuntu Mono, monospace;}
input { width:10em; height:2em; margin:0.2em;}
</style>
<h1>Registration - Interschool IT Fair</h1>
<form name=form1 action=register.php method=POST>
School name: <input type=text name=school_name> <br>
User name : <input type=text name=user_name> <br>
Password
: <input type=password name=pw> <br>
Repeat Password: <input type=password name=pw2> <br>
Mobile No.
: <input type=text name=mobile> <br> <br>
<input type=submit value=Submit> <input type=reset value=Clear>
</form>
</body>
</html>
03-FORM02.HTML output
Registration - Interschool IT Fair
School name:
User name :
Password :
Repeat Password:
Mobile No. :
Submit
Clear
04-LIST01.HTML source
<!-Design a webpage showing tourist destinations in kerala

Tourist Department of Kerala
============================
1. Beach
a) Kovalam
b) Muzhappilangad
c) Kappad
2. Hill Station
a) Munnar
b) Wayanad
c) Gavi
3. Wild Life
a) Iravikulam
b) Muthanga
c) Kadalundi
-->
<html>
<head> <title> Tourist Department of Kerala </title> </head>
<body>

<style> body {font-family: Fantasque Sans Mono, Ubuntu Mono,monospace;} </style>
<H1><u>Tourist Department of Kerala </u> </H1>
<ol type=1>
<li> Beach
<ol type=a>
<li> Kovalam </li>
<li> Muzhappilangad </li>
<li> Kappad </li>
</ol>
</li>
<li> Hill Station
<ol type=a>
<li> Munnar </li>
<li> Wayanad </li>
<li> Gavi </li>
</ol>
</li>
<li> Wild Life
<ol type=a>
<li> Iravikulam </li>
<li> Muthanga </li>
<li> Kadalundi </li>
</ol>
</li>
</ol>
</body>
</html>
04-LIST01.HTML output
Tourist Department of Kerala
1. Beach
a. Kovalam
b. Muzhappilangad
c. Kappad
2. Hill Station
a. Munnar
b. Wayanad
c. Gavi
3. Wild Life
a. Iravikulam
b. Muthanga
c. Kadalundi
05-LINK_MAILTO.HTML source
<!-Design a personal webpage for your friend.

It should have a link to hid email address.
-->
<html>
<head> <title> My Webpage </title> </head>
<body>
<style> body {font-family:Fantasque Sans Mono,Ubuntu Mono, monospace; } </style>
<h1> About Me </h1>
Name: Kiran <br>
DOB: 2/2/2000 <br>
Address: <br>
Sooraj <br>
Fort Kochi <br>
Ernakulam <br>
Nationality: Indian <br>
E-Mail: <a href=mailto:kiran@gmail.com>kiran@gmail.com</a>
</body>
</html>
05-LINK_MAILTO.HTML output
About Me
Name: Kiran
DOB: 2/2/2000
Address:
Sooraj
Fort Kochi
Ernakulam
Nationality: Indian
E-Mail: kiran@gmail.com

Kerala HSS CS Lab HTML Sample Programs

Загружено:

Сведения о документе

Авторское право

Доступные форматы

Поделиться этим документом

Поделиться или встроить документ

Параметры публикации

Этот документ был вам полезен?

Это неприемлемый материал?

Авторское право:

Доступные форматы

Kerala HSS CS Lab HTML Sample Programs

Загружено:

Авторское право:

Доступные форматы

Kerala HSS CS Lab

HTML Source Code and Output

<!-Design a webpage containing tables as below

Day length (earth hrs)

Year length (earth days)

<!-Design an HTML form to accept the curriculum

form should provide

The form should provide buttons to save and clear

<!-Design a webpage showing tourist destinations in kerala

<!-Design a personal webpage for your friend.

Вам также может понравиться