itfinal it lab manual

MARWADIEDUCATIONFOUNDATION’SGROUPOF INSTITUTIONS

FACULTYOFPOSTGRADUATE STUDIES&RESEARCHIN

ENGINEERING&TECHNOLOGY,GAURIDADCAMPUS. DEPARTMENTOFCOMPUTERENGINEERING




KAVAR NILESH 130570742004 INTERNET TECHNOLOGY

Lab#1: Introduction to HTML.

Basic HTML, Formatting and Fonts, Commenting code.

Create Following Web Page Using given tags with its attributes.

TAG ATTRIBUTESTOBE USED

<HTML> -- <HEAD> -- <TITLE> -- <BODY> BGCOLOR,TEXT,BACKGROUND <H1>,<H2>,<H3>,<H4>,<H5>,<H6>

ALIGN <FONT> FACE,SIZE,COLOR <P> (Paragraph) -- <U> (Underline) -- <HR> (Horizontal Rules) WIDTH,COLOR,ALIGN <BR>(Break Line) --








HTML CODE:

<html> <head> <title>Lab#1</title> <font size="6"> <b> MEFGI...WAD/WTP - Lab Session#1 </b> </font> </head> <body style="background-color: cyan ;"> <h1>Heading#1</h1> <h2>Heading#2</h2> <h3>Heading#3</h3> <h4>Heading#4</h4> <h5>Heading#1</h5> <h6>Heading#1</h6> <font color="red" size="15">This text displays the use of font tag with font face, color and size.</font> <p>paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. <u> paragraph 1 start with underline.</u> here paragraph 1 start here.</p> <hr> Some random text. Some random text. Some random text. Some random text. Some random text.<br> Some random text. Some random text. Some random text. using br tag we can break the line.<br> Some random text. Some random text. Some random text. Some random text. Some random text. </body> </html>








Lab#2: Formatting web pages with HTML

Hyperlink, Lists, Tables, Images:

1) Create following Web Page Using given tags with its attributes.

TAG ATTRIBUTESTOBE USED <HTML> -- <HEAD> -- <TITLE> -- <BODY> BGCOLOR,TEXT,BACKGROUND <H1>,<H2>,<H3>,<H4>,<H5>,<H6>

ALIGN <A> -- <UL> -- <OL> -- <LI> -- <TABLE> BORDER <TH> -- <TR> -- <TD> --








HTML CODE: <html> <head> <title>Lab#2</title> <font size="6"> <b> MEFGI...WAD/WTP - Lab Session#2 </b> </font> </head><br> <br> <br> <body style="background-color:cyan;"> <a href="http://www.marwadieducation.edu.in">Click for Marwadi Education</a> <br> <br> <b>List of Institutes</b> <ul> <li>FOE <li>FOT <li>FOPG </ul> <b>List of Subjects</b> <ol type="1"> <li>WAD <li>WTP <li>IS </ol> <br> <table border="1"> <tr> <td><b>Subjects</b></td> <td><b>Marks</b></td> </tr> <tr> <td>WAD</td> <td>20</td> </tr> <tr> <td>WTP</td> <td>30</td> </tr> </table> <img src="D:\ARPAT\1846_365175073598623_767591942_n.jpg" width="144" height="144" /> </body> </html>








Lab#2 Formatting web pages with HTML

Simple HTML Forms:

2) Create following Web Page Using given tags with its attributes.

TAG ATTRIBUTESTOBE USED <HTML> -- <HEAD> -- <TITLE> -- <BODY> BGCOLOR,TEXT,BACKGROUND <H1>,<H2>,<H3>,<H4>,<H5>,<H6> ALIGN <FORM> -- <TABLE> -- <TR> -- <TD> -- <INPUT> TYPE, NAME, SIZE, MAXLENGTH <SELECT> NAME <OPTION> VALUE,SELECTED VALUE








HTML CODE:-

<html>

<head>

<title> Lab#2_2 </title>

</head>

<body bgcolor=#00eeff>

<h1><b>MEFGI...WAD/WTP -Lab Session#2_2 </b></h1><br><br>

<h2>Registration Form Demo</h2>

<form>

<table align="left">

<tr>

<td> First Name </td>

<td><input type="text" name="fn" maxlength=30 /></td>

</tr>

<tr>

<td> Last Name </td>

<td><input type="text" name="ln" maxlength=30 /></td>

</tr>

<tr>

<td> Desired Login Name </td>

<td><input type="text" name="dln" /></td>

</tr>

<tr>

<td> Choose a Password </td>

<td><input type="password" name="pwd" /></td>

</tr>

<tr>

<td> Re-enter a Password </td>

<td><input type="password" name="pwd" /></td>

</tr>

<tr>

<td> Choose a question </td>








<td><select name="Security Question">

<option name="sop1" selected>Security Question</option>

<option name="sop2" value="who is your best friend?">who is your best friend?</option>

<option name="sop3" value="who is your favourite teacher?">who is your favourite teacher?</option>

<option name="sop4" value="what is your nick name?">what is your nick name?</option>

</select>

</td>

</tr>

<tr>

<td> Answer </td>

<td><input type="text" name="ans" /></td>

</tr>

<tr>

<td> Location </td>

<td><select name="s2">

<option name="lop1">country</option>

<option name="lop2" value="India" selected>India</option>

<option name="lop3" value="afrika">afrika</option>

<option name="lop4" value="shri-lanka">shri-lanka</option>

</select>

</td>

</tr>

</table>

</body>

</html>








Lab#3: Introduction to CSS

Basic syntax and structure, using CSS, background images, Colors and properties

Create following Web Page Using given tags with its attributes.

TAG ATTRIBUTESTOBE USED <HTML> -- <HEAD> -- <TITLE> -- <BODY> BGCOLOR,TEXT,BACKGROUND <H1>,<H2>,<H3>,<H4>,<H5>,<H6> ALIGN, CLASS <SPAN> CLASS <P> ID








HTML CODE: <html>

<head>

<title>Lab#3</title>

<link rel="stylesheet" href="a.css"/>

<font size="6" color="blue">

<b>

MEFGI...WAD/WTP - Lab Session#3

</b>

</font>

</head>

<body>

<h1>Heading#1</h1>

<h2>Heading#2</h2>

<h3 class="redbox">Heading#3</h3>

<h4>Heading#4</h4>

<h5>Heading#5</h5>

<h6>Heading#6</h6>

<font color="red" size="15">This text displays the use of font tag with font face,color and size.</font>

<p>paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here.

paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. <u> paragraph 1 start with underline.</u> here paragraph 1 start here.</p>

<hr>

Some random text. Some random text. Some random text. Some random text. Some random text.<br>

Some random text. Some random text. Some random text. using br tag we can break the line.<br> Some random text. Some random text. Some random text. Some random text. Some random text.

</body>

</html>

CSS CODE

body

{

background:#bdcffb url(abstract_0037.jpg);

color:#00ff00;

}

h3.redbox








{

color:#FFFFFF;

}








Lab#4: Formatting web pages with CSS Manipulating texts, using fonts, borders and boxes, margins, padding lists.

Create following Web Page Using given tags with its attributes.

TAG ATTRIBUTESTOBE USED <HTML> -- <HEAD> -- <TITLE> -- <BODY> BGCOLOR,TEXT,BACKGROUND <H1>,<H2>,<H3>,<H4>,<H5>,<H6> ALIGN, CLASS <IMG> FLOAT <P> ID








HTML CODE:

<html>

<head>

<title>Lab#3</title>

<style type="text/css">

img {float:left;}

</style>

<link rel="stylesheet" href="b.css"/>

<font size="6" color="blue">

<b>

MEFGI...WAD/WTP - Lab Session#4

</b>

</font>

</head>

<body>

<h1>Heading#1</h1>

<h2>Heading#2</h2>

<h3 class="redbox">Heading#3</h3>

<h4>Heading#4</h4>

<h5 class="bbox">Heading#5</h5>

<h6 class="bluebox">Heading#6</h6>

<font color="red" size="15">This text displays the use of font tag with font face,color and size.</font>

<p>

<img src="1475872_10201919425338870_1838258255_n.jpg" width="50" height="50" />paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here.

paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. paragraph 1 start here. <u> paragraph 1 start with underline.</u> here paragraph 1 start here.</p>

<hr>

Some random text. Some random text. Some random text. Some random text. Some random text.<br>

Some random text. Some random text. Some random text. using br tag we can break the line.<br> Some random text. Some random text. Some random text. Some random text. Some random text.

</body>

</html>

CSS code








body

{

background:#bdcffb url(abstract_0037.jpg);

color:#00ff00;

}

h3.redbox

{

color:#FFFFFF;

}

h5.bbox

{

color:#FF0000;

}

h6.bluebox

{

color:#FF0000;

}

h1

{

border:5px solid #ff0000;

color:#ff0000;

}

h2

{

border:5px dotted #ff0000;

color:#ff0000;

}

h4

{

border:5px groove #ff0000;

color:#ff0000;

}

#f1

{

font:35px;

color:#ff0000;

font-family:"'Lucida Handwriting’, script";

}

#p1

{

font-weight:italic;








}

#s1

{

text-decoration:underline;

color:lightblue;

}

#hr1

{

color:red;

}








Lab#5: Introduction to Java script How to develop Java script, variables, functions, condition

Create following Web Page Using given tags with its attributes and Java script.

1)








Screenshot#1 Program with two buttons to print 1 to100








Screenshot#1 Program with two buttons to print 100 to 0








Lab#5: Introduction to Java script How to develop Java script, variables, functions, conditions








ADDITION:

SUBTSACTION:








MULTIPLICATION:

DIVISION:








HTML CODE: <! DOCTYPE> <Html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> </head> <body> <h2>Calculator</h2> <form> <table cellpadding="2px"> <tr> <td>1st Number:</td> <td><input type="text" name="1st" id="1st" size="20px" /></td> </tr> <tr> <td>2nd Number:</td> <td><input type="text" name="2nd" id="2nd" size="20px" /></td> </tr> <tr> <td>Total:</td> <td><input type="text" name="total" id="total" size="20px" /></td> </tr> <tr> <td colspan="2"> <input type="button" value="Add" style="width:50px;" onclick="add()" /> <input type="button" value="Sub" style="width:50px;" onclick="substract()"/> <input type="button" value="Mul" style="width:50px;" onclick="mul()"/> <input type="button" value="Div" style="width:50px;" onclick="div()"/> </td> </tr> </table> </form> <script> function add() { var first=document.getElementById('1st').value; var second=document.getElementById('2nd').value; if(first=="") { alert("Enter First Value"); document.getElementById('1st').focus(); }








else if(second=="") { alert("Enter Second Value"); document.getElementById('2nd').focus(); } else { var total=parseInt(first,10)+parseInt(second,10); document.getElementById('total').value=total; } } function substract() { var first=document.getElementById('1st').value; var second=document.getElementById('2nd').value; if(first=="") { alert("Enter First Value"); document.getElementById('1st').focus(); } else if(second=="") { alert("Enter Second Value"); document.getElementById('2nd').focus(); } else { var total=parseInt(first,10)-parseInt(second,10); document.getElementById('total').value=total; } } function mul() { var first=document.getElementById('1st').value; var second=document.getElementById('2nd').value; if(first=="") { alert("Enter First Value"); document.getElementById('1st').focus(); } else if(second=="") { alert("Enter Second Value");





Lab#6: Browser interaction and validations using JS

1) Create following Web Page Using given tags with its attributes and Java script.





HTML CODE: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> </head> <body> <div align="center"> <h3 style="color:#33F">Registartion Form</h3> <form name="registrationform" method="post" action="submit.php" onsubmit=" return validationcheck()"> <table cellpadding="2px"> <tr> <td>First Name:<b style="color:red">*</b></td> <td><input type="text" name="fname" id="fname" size="20"/></td> </tr> <tr> <td>Last Name:<b style="color:red">*</b></td>


<td><input type="text" name="lname" id="lname" size="20"/></td> </tr> <tr> <td>User Name<b style="color:red">*</b></td> <td><input type="text" name="email" id="email" placeholder="[email protected]"/></td> </tr> <tr> <td>Password:<b style="color:red">*</b></td> <td><input type="password" name="password" id="password" size="20"/></td> </tr> <tr> <td>ReEnter Password:<b style="color:red">*</b></td> <td><input type="password" name="repassword" id="repassword" size="20" /></td> </tr> <tr> <td>Gender:<b style="color:red">*</b></td> <td>Male<input type="radio" id="gender" name="gender" value="Male" checked="checked"/> Female<input type="radio" id="gender" name="gender" value="Female"/> </td> </tr> <tr> <td></td> <td> <input type="checkbox" /> Verify Terms & Condition. </td> </tr> <tr> <td></td> <td><input type="submit" value="Register" /></td> </tr> </table> </form> </div> <script> $(document).ready(function(e) { $("input,textarea,select").focus(function() { $(this).css("background-color","#cccccc"); }); $("input,textarea,select").blur(function(){ $(this).css("background-color","#FFF"); }); }); function validationcheck() { var fname=document.getElementById('fname'); var lname=document.getElementById('lname'); var email=document.getElementById('email'); var password=document.getElementById('password'); var repassword=document.getElementById('repassword');





2) Create following Web Page Using given tags with its attributes and Java script. Image Slider, images should be in repeating fashion for infinite time.

Use following functions.

Image ()

Eva l ()

set Timeout ()

HTML CODE: html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"

/>

<title>Untitled Document</title>

</head>

<body>

<img src="dreamboy_sn4n27ia.jpeg" width="400" height="300"

border="5"/>

</body>

</html>

itfinal it lab manual

Engineering

random text

color paragraph

internet technology

following web page

wadwtp lab session

wadwtp lab session

html code

tag attributestobe