Professional Documents
Culture Documents
JUGLAN, HISAR-125001
LAB MANUAL
BCA-247
1
Hardware Requirements
Any operating system like UNIX, LINUX
and Windows.
Software Requirements
Notepad, Any web Browser like Internet
Explorer, Goggle Chrome, Mozilla Firefox etc.
2
INDEX
BCA-247
3
Introduction to Web Design
4
Program 1
<HTML>
<HEAD>
</HEAD>
<BODY BGCOLOR="ORANGE">
<H1 ALIGN="CENTER">FORM</H1>
<FORM>
Department:<BR>
<OPTION>Sales
<OPTION>Accts.
<OPTION>Mkt.
<OPTION>HRD.
<OPTION>ADV.
</SELECT><BR><BR>
5
<INPUT TYPE="RADIO" NAME="RADIO"> B<BR><BR>
</H3></FORM>
</FONT>
</BODY>
</HTML>
6
OUTPUT
7
Program 2
<!- - PICTURE>
<HTML>
<HEAD>
<TITLE>PICTURE</TITLE>
</HEAD>
<BODY BGCOLOR="SKIN">
</BODY>
</HTML>
<!—LIST>
<HTML>
<HEAD>
<TITLE>SYLLABUS</TITLE>
</HEAD>
<BODY BGCOLOR="PINK">
<H1 ALIGN="CENTER">SYLLABUS</H1>
<H3>
<UL>
<LI>DATA COMMUNICATION
<OL>
8
<LI>DTE&DCE INTERFACE
<LI>MULTIPLEXING
</OL>
<LI>OPERATING SYSTEM
<OL>
<LI>PROCESS MGT.
<LI>DISTRIBUTED SYSTEM
<LI>MEMORY MGT.
</OL>
</UL>
</H3></BODY></HTML>
<! - - TABLE>
<HTML>
<HEAD>
<TITLE>TABLE</TITLE>
</HEAD>
<BODY BGCOLOR="RED">
<H1 ALIGN="CENTER">TABLE</H1>
<TR> <TH>NAME</TH>
<TH>ROLL NO</TH>
<TH>MARKS</TH>
9
</TR> <TR>
<TD>AMIT</TD>
<TD>5909302</TD>
<TD>85</TD>
</TR> <TR>
<TD>MANOJ</TD>
<TD>5908211</TD>
<TD>75</TD>
</TR> <TR>
<TD>DEEPAK</TD>
<TD>5909316</TD>
<TD>80</TD>
</TR>
</TABLE>
</BODY></HTML>
<! - - HYPERLINK>
<HTML>
<HEAD>
<TITLE>HYPERLINK</TITLE>
</HEAD>
<BODY BGCOLOR="LIME">
<H1 ALIGN="CENTER">HYPERLINK</H1>
</A>
10
</BODY>
</HTML>
<HTML>
<HEAD>
</HEAD>
<FRAME>
<FRAMESET ROWS="50%,*">
<FRAMESET COLS="50%,*">
<FRAME SRC="P.HTML">
<FRAME SRC="S.HTML">
</FRAMESET>
<FRAMESET COLS="50%,*">
<FRAME SRC="H.HTML">
<FRAME SRC="T.HTML">
</FRAMESET>
</FRAME>
</HTML>
11
OUTPUT
12
Program 3
<html>
<head>
<title>CHARACTER ENTITIES</title>
</head>
<body>
<tr>
<h1 align="center">
<th>S.No.</th>
<th>Name</th>
<th>Symbol</th>
<th>Description</th>
</tr>
<tr>
<h1 align="center">
<th>1</th>
<th>quot</th>
<th>""</th>
<th>quotation mark</th>
13
</tr>
<tr>
<h1 align="center">
<th>2</th>
<th>amp</th>
<th>&&</th>
<th>ampercent mark</th>
</tr>
<tr>
<h1 align="center">
<th>3</th>
<th>lt</th>
<th><</th>
</tr>
<tr>
<h1 align="center">
<th>4</th>
<th>gt</th>
<th>></th>
</tr>
<tr>
<h1 align="center">
<th>5</th>
14
<th>copy</th>
<th>©</th>
<th>copy mark</th>
</tr>
<tr>
<h1 align="center">
<th>6</th>
<th>trade</th>
<th>&trade</th>
<th>trade mark</th>
</tr>
</body>
</html>
Output :
15
Program:4
<! To Create a Web Page in HTML to Show the Block Level Elements and Text Level
Elements >
<html>
<head>
</head>
<body>
<h3>
</p> </h3>
<div align="right">
can be effected by div at once. Many paragraphs and other block Elements
can be effected by div at once. Many paragraphs and other block Elements
16
can be effected by div at once. Many paragraphs and other block Elements
can be effected by div at once. </p>
</div>
</center>
</font>
17
<! 2. Logical Elements>
</body>
</html>
18
Output :
19
Program 5
<! To Create a Web Page in HTML to show varies Confectionary Items using Ordered List
and Unordered List. >
<html>
<head>
</head>
<body>
<center>
<h3>
<ol>
</ol>
<li>PEPSI </li>
<li>COKE</li>
<li>LIMCA</li>
20
</ol>
<ul type="disc">
<li type="circle">
UNCLE CHIPS
<li type="square">
KURKURE
<li type="circle">
NAMKEEN
</ul>
</h3>
</center>
</body>
</html>
21
Output :
22
Program-6
<html>
<head>
<body bgcolor="White"><b>
<pre><b>
</b></pre>
</body>
</html>
23
Output
24
Program No. 7
AIM: - Create a web page which displays the map of your state link, each city of the image map,
such that the respective HTML page of the city is displayed when the user selects an area.
Main page
<html>
<body>
<map name="countrymap">
</map>
</body>
</html>
25
HARYANA.HTML
<html>
<body>
<h1>State :- Haryana</h1>
<h1>Capital :- Chandigarh</h1>
<br>
<a href="indiamap.html">Back</a>
</body>
</html>
26
27
Program:8
body
font-size:50pt;
font-family:Console;
background-color;white;
h1
font-size: 40pt;
font-family: Arial;
color: blue;
text-align="center";
} --->
<html>
<head>
</head>
<style>
28
{
text-indent: 0.5in;
margin-left: 50px;
margin-right: 50px;
color: blue;
font-size: 40pt;
</style>
</head>
<body style="background-color:white;">
<p><b><i>
</p>
</body>
</html>
29
Output:
30
Program:9
<html>
<head>
<title>Registration Form</title>
</head>
<body>
</label><br><br>
</label><br><br>
</label><br><br>
<label><b>Password : </b>
31
<input type="text" name="id4" id="id4" size="50"
maxlength="10"/>
</label><br><br>
</label><br><br>
<strong>Sex : </strong><br>
<label><b>D: </b>
</label><br>
<label><b>M: </b>
</label><br>
<label><b>Y:</b>
</label><br><br>
<b>Qualifications : </b></br>
</label><br><br>
32
<b>Senior Secondary</b><input type="checkbox" name="a1" id="a1"/>
<b>MBA</b><input type="checkbox"
name="a1" id="a1"/>
<b>Experience</b>
<option>0-1 Year</option>
<option>2-3 Year</option>
<option>3-5 Year</option>
</select><br><br>
<center>
</body>
</html>
33
Output:
34
Program No. :10
<! A Web Page in HTML to show books in inventary in different tables using Row Span
and Column Span.>
<html>
<head>
<title>Book Inventary</title>
</head>
<body>
<tr>
<th colspan="5">
BOOK INVENTARY
</th>
</tr>
<tr>
<th>SR. NO.</th>
<th>BOOKS</th>
<th>AUTHOR</th>
<th>PRICE</th>
</tr>
<tr>
<td rowspan="2">1</td>
35
<td>YASHWANT KANETKER</td>
<td>250</td>
</tr>
<tr>
<td bgcolor="white">HTML</td>
<td>WILLIAM</td>
<td>420</td>
</tr>
<tr>
<td rowspan="2">2</td>
<td>PETERSONS</td>
<td>205</td>
</tr>
<tr>
<td bgcolor="white">STATISTICS</td>
<td>S.P. GUPTA</td>
<td>240</td>
</tr>
<tr>
<td rowspan="2">3</td>
<td>TANONBAUM</td>
<td>200</td>
</tr>
36
<tr>
<td>BAKER</td>
<td>340</td>
</tr>
<tr>
<td rowspan="2">4</td>
<td>CARL TOWNSEND</td>
<td>260</td>
</tr>
<tr>
<td bgcolor="white">COMPILER</td>
<td>ALFRED V. AHO</td>
<td>240</td>
</tr>
</table>
</body>
</html>
37
Output:
38
Program No. :11
<! Create a Web Page in HTML to show Admission form in OITM >
<html>
<body bgcolor="pink">
<h1><u>ADMISSION FORM</b></u></h1></center>
<form><hr><pre>
</pre>
<b>Gender</b>
</br>
</br>
<center>
<input type="submit">
<a href="E:\html\form1.html">submit</a>
<input type="reset">
</center>
</form>
39
</body>
</html>
Output:
40
Program No. :12
<! A Web Page in HTML to show your resume using Appropriate Formatting Elements. >
<html>
<head>
<title>Resume</title>
</head>
<body>
<center><h2>CURRICULAM VITAE</u></h2></center><br>
Vandana<br>
Mob.9034453983<br>
<hr><br>
<tr>
<td colspan="4">
<center><b>Objective</b></center>
</tr>
</table>
<tr>
41
<td colspan="5">
<center><b>Educational Qualification</b></center>
</tr>
</table>
<h3><b><u>Professional:</u></b></h3>
Sirsa(Haryana) .
<center><br>
<tr>
<th>Class</th>
<th>Year of Passing</th>
<th>%age</th>
</tr>
<tr>
<th>Dec. 2007</th>
<th>__%</th>
</tr>
<tr>
<th>May 2008</th>
<th>__%</th>
</tr>
<tr>
42
<th>MCA 3rd Sem</th>
<th>Dec. 2008</th>
<th>__%</th>
</tr>
<tr>
<th>May 2009</th>
<th>__%</th>
</tr>
</table>
</center><br>
<h3><u>Academic:</u></h3>
<pre>
</pre>
<tr>
<td colspan="5">
<center><b>Technical Skills<b></center>
</tr>
</table><br>
<pre>
43
Data Structures, Database Programming, Software Engineering, Operating Systems,
Computer Networks, Programming Languages, Visual Basic, Computer Organization,
Visual C++, Computer Algorithms, D.M.S., N.A., Digital Design, Computer Architecture,
</pre>
<tr>
<td colspan="5">
<center><b>Personal Details<b></center>
</tr>
</table><br>
<ul type="disc">
<pre>
Name Vandana
Sex Female
Nationality Indian
</pre><br>
<pre>
Date:______________
Place:_____________
</pre>
44
</body>
</html>
Output:
45
Program:13
<! A Web Page in HTML to show all the Text, Color, Background and Font Elements. >
<html>
<head>
</head>
END!!!!!</b></font>
ORKUTTING</b></font>
ARIAL BLACK.</b></font>
COURIER.</b></font>
</body>
</html>
46
OUTPUT
:
47
Program-14
<html>
<head>
<title>Nested List</title>
</head>
<body>
<p> Drink</p>
<ol>
<li>
<dl>
<dt>Hot Drinks</dt>
</dl>
</li>
<ul type="Square">
<li>Tea</li>
<li>Coffee</li>
</ul>
<li>
<dl>
<dt>Cold Drinks</dt>
48
</dl>
</li>
<ul type="disc">
<li>Pepsi</li>
<li>Cock</li>
</ul>
</ol>
</body>
</html>
49
OUTPUT :
50