Practicle File of Web Design

Roll No.
: 3107417
SHIVALIK INSTITUTE OF ENGG. & LABORATORY
SIET TECHNOLOGY,ALIYASPUR MANUAL
PRACTICAL EXPERIMENT INSTRUCTION SHEET
PROGRAM TITLE: DESIGN A FORM ON THE WEB PAGE HAVING AN
EMP DETAIL OF THE COMPANY
EXPERIMENT NO.: - 1 DEPTT. :- I.T. ISSUE DATE: -
LABORATORY:- WD LAB SEMESTER: -5th PAGE.NO: 1.1
/*Program No. 1*/

/* DESIGN A FORM ON THE WEB PAGE HAVING AN EMP DETAIL OF
THE COMPANY */
<html>
<head>
<title>my web page</title>
</head>
<h1 align="center"font size="30"><b><u>Employee details</u></b>
</h1>
<body>
Password<input type="password" name="Password"><br>
code<input tye="text" name="code">
Name<input type="text" name="name"><br>
city<input type="text" name="city"<br>
Benifits<input type="checkbox"name="benifits">
daily<input type="checkbox"name="daily"><br>
grade<input type="radio" name="a">a
<input type="radio" name="b">b
deptt<select name="deptt">
<option>sales</option>
<option>accoint</option>
<option>market</option>
<option>hrd</option>
</select><br><center>
<input type="submit" name="ok" value="ok">
</body>
</html>
PREPARED BY :- ISHAN MAKKAR APPROVED BY :- Ms.Himanshu

Roll No. : 3107417
PROGRAM TITLE: : DESIGN A FORM ON THE WEB PAGE HAVING AN
EMP DETAIL OF THE COMPANY

Roll No. : 3107417
PROGRAM TITLE: CREATE AND USE A STYLE SHEET FOR LOGIN
AND DISPLAY DETAIL PAGE
/*Program No. 2*/

/*CREATE AND USE A STYLE SHEET FOR LOGIN AND DISPLAY DETAIL PAGE */
<html>
<head>
<meta name="generator" contents="Microsoft visual studio 6.0">
</title></title>
<style>
body(margin=left:o;margin:0;margin-top:0;margin-bottom:0;)
heading
{
font-size:15px;
font family:bookman old style;
}
subhead
{
font-size:13px;
font family:bookman old style;
}
.a
{
font-size:10px;
color:#000000;
font-family:verdana;
text-decoration::none
}
.a.hover
{
font-size:10px;
color:#6784ca;
font-family:verdana;
text-declaration:none
}
</style>
</head>
<body>
<table width=700 border=1 cellspacing=0 cellpadding=0>
<tr><td align="right" height=1>
<table border=0 cellspacing=5 cellpadding=5>
<tr>
<td valign=top><a class=a href="index.htm">home</a></td>
<td valign=top><a class=a href="product.htm">product</a></td>
<td valign=top><a class=a href="orders.htm">orders</a></td>
<td valign=top><a class=a href="services.htm">services</a></td>
<td valign=top><a class=a href="about us.htm">about us</a></td>
<td valign=top><a class=a href="contactus.htm">contactus</a></td>
</tr>
</table>
</td></tr>

<td align="center" border=0 cellspacing=0 cellpadding=0 width=50%>

<table >
<tr><td align="center" class="subhead">User name:</td><td><input
name="txtname"></td></tr>
<tr><td align = "center" class="subhead">Password:</td><td><input
name="txpass"></td></tr>
</tr>
<tr>
<td align ="center" valign="top">
<table align="center" border=0 cellspacing=0 cellpadding=0 width=50%>
<tr><td align="center" colspan="3"class="heading><b><login user</b></td></tr>
<tr><td colspan="3">
<hr>
<input align="center" type="button" value="login User"></td></tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td></tr>
</table>
</body>
</html>

Roll No. : 3107417
PROGRAM TITLE: CREATE AND USE A STYLE SHEET FOR LOGIN
AND DISPLAY DETAIL PAGE

Roll No. 3107417
PROGRAM TITLE: WRITE A PROGRAM IN JAVASCRIPT TO MAKE A
PERSONALIZED WELCOME PAGE
/*Program No. 3*/

/* WRITE A PROGRAM IN JAVASCRIPT TO MAKE A PERSONALIZED WELCOME
PAGE */
<html>
<head>
<title>homepage</title>
</head>
<body>
<SCRIPT LANGUAGE="javascript">
document.write("<h1>Greetings ");
document.write(prompt("Enter your name:","name"));
document.write(" Welcome to my home page </h1>");
</script>
</body>
</html>

Roll No. : 3107417
PROGRAM TITLE: WRITE A PROGRAM IN JAVASCRIPT TO MAKE A
PERSONALIZED WELCOME PAGE

Roll No. : 3107417
PROGRAM TITLE: WRITE A PROGRAM IN JAVA SCRIPT TO DISPLAY
ALL THE INFORMATION ABOUT THE BROWSER BEING USED
/*Program No. 4*/
/* WRITE A PROGRAM IN JAVA SCRIPT TO DISPLAY ALL THE INFORMATION
ABOUT THE BROWSER BEING USED */
<html>
<head>
<title>Browser Information</title>
</head>
<body>
<h1> Browser InFORMATION</h1>
<HR>
<P>
The <b> navigator </b> object contains the following information
about the browser you are using .
</p>
<ul>
<script LANGUAGE="javascript"type="text/javascript">
document.write("<li><b>code name:</b>"+navigator.appcodename);
document.write("<li><b>app name:</b>"+navigator.appname);
document.write("<li><b>app version:</b>"+navigator.appversion);
document.write("<li><b>user agent:</b>"+navigator.useragent);
document.write("<li><b>language:</b>"+navigator.language);
document.write("<li><b>platform:</b>"+navigator.platform);
</script>
</ul>
<hr>
</body>
</html>
PREPARED BY :- ISHAN MAKKAR APPROVED BY :-Ms.Himanshu

Roll No. : 3107417
SHIVALIK INSTITUTE OF ENGG. OF LABORATORY
PROGRAM TITLE: WRITE A PROGRAM IN JAVA SCRIPT TO DISPLAY
ALL THE INFORMATION ABOUT THE BROWSER BEING USED
Roll No. : 3107417
SIET TECHNOLOGY ,ALIYASPUR MANUAL
PROGRAM TITLE: CREATE A WEB PAGE WITH FOUR FRAMES FIRST
FRAME HAS A PICTURE,SECOND HAS A TABLE SHOWING DETAILS
OF STUDENTS ,THIRD FRAME HAS A SYLLABUS OF YOUR
SEMESTER AND THE LAST FRAME HAS HYPER LINK TO A
DIFFERENT WEB PAGE
/*Program No. 5*/
/* Create a web page with four frames first frame has a picture,second has a
table showing details of students ,third frame has a syllabus of your semester
and the last frame has hyper link to a diff web page */
<html>
<head>
<title>web apge</title>
</head>
<frameset rows="50%,*">
<frameset cols="50%,50%">
<frame src="E:\pictures\omkara.jpg">
<frame src="C:\Documents and Settings\Himanshu\My Documents\detail.doc">
</frameset>
<frameset cols="50%,50%">
<frame src="C:\Documents and Settings\Himanshu\My Documents\syllabus.doc">
<frame src="C:\Documents and Settings\Himanshu\My Documents\Broad band\New
Folder\flower.htm">
</frameset>
</frameset>
</html>

Roll No. : 3107417
PROGRAM TITLE : CREATE A WEB PAGE WITH FOUR FRAMES FIRST
FRAME HAS A PICTURE,SECOND HAS A TABLE SHOWING DETAILS
OF STUDENTS ,THIRD FRAME HAS A SYLLABUS OF YOUR
SEMESTER AND THE LAST FRAME HAS HYPER LINK TO A
DIFFERENT WEB PAGE
Roll No. : 3107417
PROGRAM TITLE: WRITE A PROGRAM-> A. DESIGN DATA.XML
WHICH DESCRIBES THE DATA ABOUT THE INVOCES
B.DISPLAY AN XML PAGE IN AN HTML PAGE AD DATA ISLANDS
/*Program No. 6*/

/* Write a program..-> a.design data.xml which describes the data about the
invoces
b.Display an xml page in an html page ad data islands*/
<html>
<head> </head>
<body>
<xml id="invs">
<invoices> <invoice id="001">
<date>01-feb-2006</date>
<from>company A</from>
<to>Company B</to>
<price>123.45</price>
</invoice>
<invoice id="002">
<date>05-sep-2006</date>
<from>Company A</from>
<to>Company C</to>
<price>34.56</price>
</invoice>
</invoices>
</xml>
<table border datasrc="#invs">
<thead><tr><th>Date<th>from<th>to<th>price</tr>
</thead> </tbody>
<tr><td><span datafld="date"></span></td>
<td><span datafld="from"></span></td>
<td><span datafld="to"></span></td>
<td><span datafld="price"></span></td></tr>
</tbody> </table>
</body> </html>

Roll No. : 3107417
PROGRAM TITLE: WRITE A PROGRAM-> A. DESIGN DATA.XML
WHICH DESCRIBES THE DATA ABOUT THE INVOCES
B.DISPLAY AN XML PAGE IN AN HTML PAGE AD DATA ISLANDS
Roll No. :3107417
PROGRAM TITLE: WRITE A PROGRAM TO CONVERT THE CELSIUS
INTO FAHRENHEIT
/*Program No. 7*/

/* WAP to convert the Celsius into Fahrenheit */
<html>
<head>
<script type="text/javascript">
function convert(degree)
{
if (degree=="C")
{
F=document.getElementById("c").value * 9 / 5 + 32
document.getElementById("f").value=Math.round(F)
}
else
{
C=(document.getElementById("f").value -32) * 5 / 9
document.getElementById("c").value=Math.round(C)
}
}
</script>
</head>
<body>
<p></p><b>Insert a number into one of the input fields below:</b></p>
<form>
<input id="c" name="c" onkeyup="convert('C')"> degrees Celsius<br />
equals<br />
<input id="f" name="f" onkeyup="convert('F')"> degrees Fahrenheit
</form>
<p>Note that the <b>Math.round()</b> method is used, so that the result will be
returned as an integer.</p>
</body>
</html>

Roll No. : 3107417
PROGRAM TITLE: WRITE A PROGRAM TO CONVERT THE CELSIUS
INTO FAHRENHEIT
Roll No. : 3107417

PROGRAM TITLE: WRITE A PROGRAM TO DISPLAY THE CLOCK.
/*Program No. 8*/

/* Write a program to display the clock. */
<html>
<head>
function startTime()
{
var today=new Date()
var h=today.getHours()
var m=today.getMinutes()
var s=today.getSeconds()
// add a zero in front of numbers<10
m=checkTime(m)
s=checkTime(s)
document.getElementById('txt').innerHTML=h+":"+m+":"+s
t=setTimeout('startTime()',500)
}
function checkTime(i)
{
if (i<10)
{i="0" + i}
return i
}
</script>
</head>
<body onload="startTime()">
<div id="txt"></div>
</body>
</html>
Roll No. : 3107417

PROGRAM TITLE: WRITE A PROGRAM TO DISPLAY THE CLOCK.
Roll No. : 3107417
PROGRAM TITLE: WRITE A PROGRAM TO MAKE AN EMAIL
REGISTRATION FROM USING JAVA SCRIPT AND VALIDATE ALL
INPUT FIELD AND DISPLAY ALL USER DETAILS ON NEW PAGE
/*Program No. 9*/

/* Write a program to make an email registration from using java script and
validate all input field and display all user details on new page */
<html>
<head>
function validate()
{
var at=document.getElementById("email").value.indexOf("@")
var age=document.getElementById("age").value
var fname=document.getElementById("fname").value
submitOK="true"
if (fname.length>10)
{
alert("The name must be less than 10 characters")
submitOK="false"
}
if (isNaN(age)||age<1||age>100)
{
alert("The age must be a number between 1 and 100")
submitOK="false"
}
if (at==-1)
{
alert("Not a valid e-mail!")
submitOK="false"
}
if (submitOK=="false")
{
return false
}
}
</script>
</head>
<body>
<form action="tryjs_submitpage.htm" onsubmit="return validate()">
Name (max 10 chararcters): <input type="text" id="fname" size="20"><br />
Age (from 1 to 100): <input type="text" id="age" size="20"><br />
E-mail: <input type="text" id="email" size="20"><br />
<br />
<input type="submit" value="Submit">
</form>
</body>
</html>
<body>
<form action="tryjs_submitpage.htm" onsubmit="return validate()">
Name (max 10 chararcters): <input type="text" id="fname" size="20"><br />
Age (from 1 to 100): <input type="text" id="age" size="20"><br />
E-mail: <input type="text" id="email" size="20"><br />
<br />
<input type="submit" value="Submit">
</form>
</body>
</html>

Roll No. : 3107417
PROGRAM TITLE: WRITE A PROGRAM TO MAKE AN EMAIL
REGISTRATION FROM USING JAVA SCRIPT AND VALIDATE ALL
INPUT FIELD AND DISPLAY ALL USER DETAILS ON NEW PAGE
Roll No. : 3107417
PROGRAM TITLE: WRITE A PROGRAM TO CREATE THE
CALCULATOR
/*Program No. 10*/

/* Write a program to to create the calculator*/
<HTML>
<HEAD>
<TITLE>Calculator</TITLE>
<SCRIPT LANGUAGE="JavaScript1.2">

</SCRIPT>
</HEAD>
<BODY>
<CNTER>
<FORM NAME ="calculator">
<INPUT TYPE ="text" NAME="input" size="22">
<BR>
<INPUT TYPE="button" NAME="plus" VALUE=" + "
onClick="updateString(' + ')">
<INPUT TYPE="button" NAME="minus" VALUE=" - "

onClick="updateString(' - ')">
<INPUT TYPE="button" NAME="times" VALUE=" x "

onClick="updateString(' * ')">
<INPUT TYPE="button" NAME="div" VALUE=" / "

onClick="updateString(' / ')"><BR>
<BR>
<INPUT TYPE="button" NAME="zero" VALUE=" 0 "
onClick="updateString(' 0 ')">
<INPUT TYPE="button" NAME="one" VALUE=" 1 "

<INPUT TYPE="button" NAME="two" VALUE=" 2 "

<INPUT TYPE="button" NAME="three" VALUE=" 3 "

<INPUT TYPE="button" NAME="four" VALUE=" 4 "

<BR>
<INPUT TYPE="button" NAME="five" VALUE=" 5 "

<INPUT TYPE="button" NAME="six" VALUE=" 6 "
<INPUT TYPE="button" NAME="seven" VALUE=" 7 "

<INPUT TYPE="button" NAME="eight" VALUE=" 8 "

<INPUT TYPE="button" NAME="nine" VALUE=" 9 "

<BR>
<INPUT TYPE="button" NAME="point" VALUE=" . "

onClick="updateString(' . ')">
<INPUT TYPE="button" NAME="clear" VALUE=" clear "

onClick="input.value=''; inputString='' ">
<INPUT TYPE="button" NAME="calc" VALUE=" = "

onClick="input.value=eval(inputString);">
</FORM>
</CENTER>
</BODY>
</HTML>

Roll No. : 3107417
PROGRAM TITLE: WRITE A PROGRAM TO CREATE THE
CALCULATOR.

Practicle File of Web Design

Enviado por

Dados do documento

Descrição original:

Título original

Direitos autorais

Formatos disponíveis

Compartilhar este documento

Compartilhar ou incorporar documento

Opções de compartilhamento

Você considera este documento útil?

Este conteúdo é inapropriado?

Direitos autorais:

Formatos disponíveis

Practicle File of Web Design

Enviado por

Direitos autorais:

Formatos disponíveis

Roll No.

/*Program No. 1*/

PREPARED BY :- ISHAN MAKKAR APPROVED BY :- Ms.Himanshu

PREPARED BY :- ISHAN MAKKAR APPROVED BY :- Ms.Himanshu

/*Program No. 2*/

<td align="center" border=0 cellspacing=0 cellpadding=0 width=50%>

PREPARED BY :- ISHAN MAKKAR APPROVED BY :- Ms.Himanshu

PREPARED BY :- ISHAN MAKKAR APPROVED BY :- Ms.Himanshu

/*Program No. 3*/

PREPARED BY :- ISHAN MAKKAR APPROVED BY :- Ms.Himanshu

PREPARED BY :- ISHAN MAKKAR APPROVED BY :- Ms.Himanshu

PREPARED BY :- ISHAN MAKKAR APPROVED BY :-Ms.Himanshu

PREPARED BY :- ISHAN MAKKAR APPROVED BY :- Ms.Himanshu

/*Program No. 6*/

PREPARED BY :- ISHAN MAKKAR APPROVED BY :- Ms.Himanshu

/*Program No. 7*/

PREPARED BY :- ISHAN MAKKAR APPROVED BY :- Ms.Himanshu

Roll No. : 3107417

/*Program No. 8*/

PREPARED BY :- ISHAN MAKKAR APPROVED BY :- Ms.Himanshu

Roll No. : 3107417

/*Program No. 9*/

PREPARED BY :- ISHAN MAKKAR APPROVED BY :- Ms.Himanshu

/*Program No. 10*/

<INPUT TYPE="button" NAME="minus" VALUE=" - "

<INPUT TYPE="button" NAME="times" VALUE=" x "

<INPUT TYPE="button" NAME="div" VALUE=" / "

<INPUT TYPE="button" NAME="one" VALUE=" 1 "

<INPUT TYPE="button" NAME="two" VALUE=" 2 "

<INPUT TYPE="button" NAME="three" VALUE=" 3 "

<INPUT TYPE="button" NAME="four" VALUE=" 4 "

<INPUT TYPE="button" NAME="five" VALUE=" 5 "

<INPUT TYPE="button" NAME="seven" VALUE=" 7 "

<INPUT TYPE="button" NAME="eight" VALUE=" 8 "

<INPUT TYPE="button" NAME="nine" VALUE=" 9 "

<INPUT TYPE="button" NAME="point" VALUE=" . "

<INPUT TYPE="button" NAME="clear" VALUE=" clear "

<INPUT TYPE="button" NAME="calc" VALUE=" = "

PREPARED BY :- ISHAN MAKKAR APPROVED BY :- Ms.Himanshu

Você também pode gostar

/Program No. 1/

/Program No. 2/

/Program No. 3/

/Program No. 6/

/Program No. 7/

/Program No. 8/

/Program No. 9/

/Program No. 10/