0% found this document useful (0 votes)
41 views

Information Technology Web Programming Laboratory: 1. Creating Webpage Using HTML Frames - HTML

The document discusses creating webpages using HTML and DHTML. It includes code for creating a basic webpage with frames using HTML tags like <frameset> and <frame>. It also includes code for another webpage with a sign-in form using tags like <form>, <input>, and <table>. Finally, it discusses creating a webpage using DHTML and includes JavaScript code to dynamically write a heading and CSS code to style hyperlinks with pseudo-classes for different link states.

Uploaded by

Abinash jeevan
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
0% found this document useful (0 votes)
41 views

Information Technology Web Programming Laboratory: 1. Creating Webpage Using HTML Frames - HTML

The document discusses creating webpages using HTML and DHTML. It includes code for creating a basic webpage with frames using HTML tags like <frameset> and <frame>. It also includes code for another webpage with a sign-in form using tags like <form>, <input>, and <table>. Finally, it discusses creating a webpage using DHTML and includes JavaScript code to dynamically write a heading and CSS code to style hyperlinks with pseudo-classes for different link states.

Uploaded by

Abinash jeevan
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/ 4

Information Technology

Web Programming Laboratory


1. Creating webpage using HTML

frames.html

<html>

<frameset cols="50%,50%><frame src="tablist.html"> <frame src="formup.html"></frameset>

</html>

tablist.html
<html>

<body>

<p align="center"><font face="Times new roman" size="5" color="Red">List of


Departments</P>

<ul type="square">

<li>Information Technology</li><li>Mechanical Engineering</li>

<li>Electronics and Communication Engineering</li><li>Computer Science Engineering</li>

</ul>

<table border ="3" cellpadding="5" cellspacing="7">

<caption align="Top"><b><font size="6" /><i>Schedule</i></b>

</caption>

<tr>

<td rowspan="3"><big><strong>Day</strong></big></td>

<td><strong>Morning</strong><td><strong> Noon

</strong></td>

</tr>

<tr>
<td> 09:00 AM-01:00 PM </td><td> 01:00 PM-05:00 PM </td>

</tr>

<tr>

<td> 10:00 AM-01:00 PM </td> <td> 02:00 PM-05:00 PM </td>

</tr>

</table>

</body>

</html>

formup.html

<html>

<head>

<title> Sign-In form </title> </head>

<body bgcolor="pink"><center>

<form name="form1"><table>Program coding:

<tr><td><b> Name:</b></td><td>input type="text" name="name"></tr>

<tr><td><b>Password:</b></td><td><input type="password" name="pwd"></tr>

<tr>

<td><b>Gender:</b></td><td><input type="radio" name="group1" value="male">Male</td>

<td><b>Gender:</b></td><td>input type="radio" name="group1" value="female"> emale</td>

</tr>

<tr><td><b>Hobby</b></td></tr>

<td><input type="checkbox" name="option1" value="atm"> ATM card</td></tr>

<tr><td>input type="checkbox" name="option1" value="cheque"> Cheque</td></tr>

</table>

<br>
<center>

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

</center>

</form>

<body>

</html>

2. Creating webpage using DHTML

Program coding:

Pseudo.html:

<html>

<head>

<body>

<center>

<script type=text/javascript>

var a=Information;

document.write(<h2>+a+Technology+</h2>);

</script>

</center>

</body>

<title>Pseudo classes for Hyperlinks</title><style


type=text/css>a.col:link{color.blue}a.col:visited{color:black}a.col:hover{color:orange}

a.big:link{color:skyblue}

a.big:visited{color:brown}a.big:hover{font-size:200%}</style>

</head>

<body>

<h3> Move the mouse over the text</h3><p>


<em>

<a class=col href=form2.html target=_blank>The text changes the color</a></em>

</p>

<p>

<em>

<a class=big href=form2.html target=_blank>The text is getting big in size</a>

</em>

</p>

</body>

</html>

You might also like