Web Technology Lab File
Web Technology Lab File
On
Web Technology
(KCS652)
Submitted for
Bachelor of Technology
In
Computer Science and Engineering
At
Submitted To Submitted by
Ms. Neha Singh Ambuj Singh
Assistant Professor 1816110024
KEC, Ghaziabad
Web Technology Lab
<body>
<h1 align="center" style="color:blue">EDUCATION DETAILS</h1><br><br>
<table border="1" background="gray" cellspacing="5" cellpadding="5">
<th>SNo</th>
<th>Course</th>
<th>Board/University</th>
<th>School/College</th>
<th>Year of Passing</th>
<th>Percentage</th>
<tr>
<td>1</td>
<td>10</td>
<td>CBSE</td>
<td>HOLY MISSION SCHOOL</td>
<td>2O16</td>
<td>10 CGPA</td>
</tr>
<tr>
<td>2</td>
<td>12</td>
<td>BSEB</td>
<td>HOLY MISSION SCHOOL</td>
<td>2018</td>
<td>63.2</td>
</tr>
</table>
</body>
</html>
2.
<html>
<head>
<title>RESUME | XYZ</title>
</head>
<body>
<!-- BEGIN DIV FOR OVERALL BOX -->
<div id="resume">
<!-- THIS DIV CENTERS OUR HEADING -->
<h1>XYZ</h1>
<h2>KG 53, GHAZIABAD</h2>
<h2>U.P., 201001</h2>
<br />
<!-- END CENTERING DIV -->
</div>
<h2>Profile</h2>
<p>
STUDENT
</p>
<br />
<h2>Education</h2>
<h3>Bachelor of Technology , Computer Science
<br />
Graduating June 2022</h3>
<p>
Dr. A P J Abdul Kalam Technical University Uttar Pradesh
</p>
<ul>
<li>
krishna engineering college
</li>
</ul>
<h3>Project</h3>
<ul>
<li>RESTAURANT BILLING MANAGEMENT
</li>
</ul>
<h3>XII</h3>
<p>
central board of secondary education
</p>
<ul>
<li>
HOLY MISSION SCHOOL
</li>
<li>
</li>
</ul>
<br />
<h2>Related Experience</h2>
<h3>KEC GHAZIABAD, 2021 -present</h3>
<p>
STUDENT
</p>
<ul>
<li>
</li>
<li>
</li>
</ul>
</li>
<li> helping
</li>
</ul>
Developed activity programs now utilized by the youth ministry in children improve reading
skills.
<h3>Franciscan Care Center Nursing Home,
<br />
Seattle, WA 1999 - 2000 </h3>
<p>
Volunteer Recreation Worker
</p>
<ul>
<li>
</li>
<li>
</li>
</ul>
Provided social support to patients by reading to them, writing letters, and visiting with them.
<tr>
<td colspan=2>
<center><font size=4><b>Student Registration Form</b></font></center>
</td>
</tr>
<tr>
<td>Name</td>
<td><input type=text name=textnames id="textname" size="30"></td>
</tr>
<tr>
<td>Father Name</td>
<td><input type="text" name="fathername" id="fathername"
size="30"></td>
</tr>
<tr>
<td>Postal Address</td>
<td><input type="text" name="paddress" id="paddress" size="30"></td>
</tr>
<tr>
<td>Personal Address</td>
<td><input type="text" name="personaladdress"
id="personaladdress" size="30"></td>
</tr>
<tr>
<td>Sex</td>
<td><input type="radio" name="sex" value="male" size="10">Male
<input type="radio" name="sex" value="Female" size="10">Female</td>
</tr>
<tr>
<td>City</td>
<td><select name="City">
<option value="-1" selected>select..</option>
<option value="New Delhi">NEW DELHI</option>
<option value="Mumbai">MUMBAI</option>
<option value="Goa">GOA</option>
<option value="Patna">PATNA</option>
</select></td>
</tr>
<tr>
<td>Course</td>
<td><select name="Course">
<option value="-1" selected>select..</option>
<option value="B.Tech">B.TECH</option>
<option value="MCA">MCA</option>
<option value="MBA">MBA</option>
<option value="BCA">BCA</option>
</select></td>
</tr>
<tr>
<td>District</td>
<td><select name="District">
<option value="-1" selected>select..</option>
<option value="Nalanda">NALANDA</option>
<option value="UP">UP</option>
<option value="Goa">GOA</option>
<option value="Patna">PATNA</option>
</select></td>
</tr>
<tr>
<td>State</td>
<td><select Name="State">
<option value="-1" selected>select..</option>
<option value="New Delhi">NEW DELHI</option>
<option value="Mumbai">MUMBAI</option>
<option value="Goa">GOA</option>
<option value="Bihar">BIHAR</option>
</select></td>
</tr>
<tr>
<td>PinCode</td>
<td><input type="text" name="pincode" id="pincode" size="30"></td>
</tr>
<tr>
<td>EmailId</td>
<td><input type="text" name="emailid" id="emailid" size="30"></td>
</tr>
<tr>
<td>DOB</td>
<td><input type="text" name="dob" id="dob" size="30"></td>
</tr>
<tr>
<td>MobileNo</td>
<td><input type="text" name="mobileno" id="mobileno" size="30"></td>
</tr>
<tr>
<td><input type="reset"></td>
<td colspan="2"><input type="submit" value="Submit Form" /></td>
</tr>
</table>
</form>
</body>
</html>
6.
<html>
<head>
<title>Institute of Engineering</title>
</head>
<body>
<ul>
<li><a href="http://my.wm.edu">myWM</a></li>
<li><a
href="http://directory.wm.edu/people/">Directory</a></li>
<li><a href="http://events.wm.edu">Events</a></li>
<li><a href="/about/visiting">Visit</a></li>
<liclass="last-side-tactical"><a href="/atoz" id="wm-
az">W&M A-Z</a></li>
</ul>
</nav>
<nav id="side_top_nav">
<ul>
<li><ahref="/about"id="about"title="About William&
Mary">About</a></li>
<li ><a href="/academics" id="academics"
title="InstituteAcademics">Academics</a></li>
<li ><a href="/admission" id="admission" title="InstituteAdmission &
Aid">Admission & Aid</a></li>
<li ><a href="/research" id="research"
title="InstituteResearch">Research</a></li>
<li ><a href="/campuslife" id="campus" title="InstituteCampus
Life">Campus Life</a></li>
<li ><a href="/news" id="news_events"
title="InstituteNews">News</a></li>
<li><a href="http://www.tribeathletics.com/" id="athletics"
title="InstituteAthletics">Athletics</a></li>
<li><a href="http://www.wmalumni.com/" id="alumni"
title="InstituteAlumni">Alumni</a></li>
<li><ahref="/giving"id="giving"title="InstituteGiving">Giving</a></li>
</ul>
</nav>
</div>
<header id="main-header"><div id="topbar"><a class="action_left icon-font"
href="#" id="menu_btn"></a><a class="mobile-header-logo"
href="index.php"><img alt="William and Mary" id="top_mark"
src="img/wm_wordmark_single_line_green.png"/></a><a class="action_right
icon-font" href="#"id="search_btn"></a></div>
<div id="desktop_header">
<nav id="tactical_nav">
<ul>
<li>
<a href="http://my.wm.edu">myWM</a>
</li>
<li>
<a href="http://directory.wm.edu/people/">Directory</a>
</li>
<li>
<a href="http://events.wm.edu">Events</a>
</li>
<li>
<a href="/about/visiting">Visit</a>
</li>
<li>
<a href="/atoz" id="wm-az">W&M A-Z</a>
</li>
</ul>
<
</nav>
</div>
<!-- end desktop_header-->
</header>
<!-- end main_header-->
<div></div>
</body>
</html>
7.
<html>
<head>
<title> My First Page </title>
</head>
<body>
<UL type='A'>
<LI>Red
<LI>Blue
<LI>Green
<LI>White
</UL><br>
<OL type='square'>
<LI>Red
<LI>Blue
<LI>Green
<LI>White
</OL><br>
<dl>
<dt>Red</dt>
<dd>Red color has the highest wavelength.</dd>
<dt>Violet</dt>
<dd>Violet color has the shortest wavelength.</dd>
</body>
</html>
8.
<html>
<FRAMESET Rows = "30%,*" >
<Frame Src="head.html" >
<FRAMESET Cols = "25%,*">
<Frame Src="navigation.html" >
<Frame Src="content.html" >
</FRAMESET>
</FRAMESET>
</html>
9.
<!DOCTYPE html>
<html>
<body>
<h1 style="color:blue" align="center">This is a Blue Heading</h1>
<p style="color:red">This is a red paragraph with inline css</p>
</body>
</html>
10.
<!DOCTYPE html>
<html>
<head>
<style>
h1 {
color:blue;
font-family:verdana;
font-size:300%;
}
p{
color:red;
font-family:courier;
font-size:160%;
}
</style>
</head>
<body>
<h1>This is aheading</h1>
<p>This is aparagraph.</p>
</body>
</html>
11.
Css
#para1 {
color:red;
text-align: center;
font-family:courier;
}
h1{
color:blue;
font-size:200%;
text-align:right;
background-color: #6495ed;
}
#para {
color: green;
text-align: center;
font-size:500%;
}
p{
border:1px solid black;
padding:10px;
margin:30px;
background-color: #e0ffff;
}
body {
background-image:url("bird.jpeg");
div{
text-decoration:overline;
font-size:200%;
}
Html code
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="mystyle.css">
</head>
<body>
<h1>This is aheading</h1>
<p id="para">This is a green paragraph.</p>
<p id="para1">This is a red paragraph.</p>
<p>This is someparagraph.</p>
</body>
</html>
12.
<html>
<head>
<title>
Greetings </title>
</head>
<body>
<script language="JavaScript">
firstName = prompt("Please enter your name", "");
document.write("Hello " +
<html>
<head>
<script type="text/javascript" src="validate.js"></script>
</head>
<body>
<form action="#" name="StudentRegistration" onsubmit="return(validate());">
<tr>
<td colspan=2>
<center><font size=4><b>Student Registration Form</b></font></center>
</td>
</tr>
<tr>
<td>Name</td>
<td><input type=text name=textnames id="textname" size="30"></td>
</tr>
<tr>
<td>Father Name</td>
<td><input type="text" name="fathername" id="fathername"
size="30"></td>
</tr>
<tr>
<td>Postal Address</td>
<td><input type="text" name="paddress" id="paddress" size="30"></td>
</tr>
<tr>
<td>Personal Address</td>
<td><input type="text" name="personaladdress"
id="personaladdress" size="30"></td>
</tr>
<tr>
<td>Sex</td>
<td><input type="radio" name="sex" value="male" size="10">Male
<input type="radio" name="sex" value="Female" size="10">Female</td>
</tr>
<tr>
<td>City</td>
<td><select name="City">
<option value="-1" selected>select..</option>
<option value="New Delhi">NEW DELHI</option>
<option value="Mumbai">MUMBAI</option>
<option value="Goa">GOA</option>
<option value="Patna">PATNA</option>
</select></td>
</tr>
<tr>
<td>Course</td>
<td><select name="Course">
<option value="-1" selected>select..</option>
<option value="B.Tech">B.TECH</option>
<option value="MCA">MCA</option>
<option value="MBA">MBA</option>
<option value="BCA">BCA</option>
</select></td>
</tr>
<tr>
<td>District</td>
<td><select name="District">
<option value="-1" selected>select..</option>
<option value="Nalanda">NALANDA</option>
<option value="UP">UP</option>
<option value="Goa">GOA</option>
<option value="Patna">PATNA</option>
</select></td>
</tr>
<tr>
<td>State</td>
<td><select Name="State">
<option value="-1" selected>select..</option>
<option value="New Delhi">NEW DELHI</option>
<option value="Mumbai">MUMBAI</option>
<option value="Goa">GOA</option>
<option value="Bihar">BIHAR</option>
</select></td>
</tr>
<tr>
<td>PinCode</td>
<td><input type="text" name="pincode" id="pincode" size="30"></td>
</tr>
<tr>
<td>EmailId</td>
<td><input type="text" name="emailid" id="emailid" size="30"></td>
</tr>
<tr>
<td>DOB</td>
<td><input type="text" name="dob" id="dob" size="30"></td>
</tr>
<tr>
<td>MobileNo</td>
<td><input type="text" name="mobileno" id="mobileno" size="30"></td>
</tr>
<tr>
<td><input type="reset"></td>
<td colspan="2"><input type="submit" value="Submit Form" /></td>
</tr>
</table>
</form>
</body>
</html>
Javascript
function validate()
{
if( document.StudentRegistration.textnames.value == "" )
{
alert( "Please provide your Name!" );
document.StudentRegistration.textnames.focus() ;
return false;
}
if( document.StudentRegistration.fathername.value == "" )
{
alert( "Please provide your Father Name!" );
document.StudentRegistration.fathername.focus() ;
return false;
}
return false;
}
if( document.StudentRegistration.District.value == "-1" )
{
alert( "Please provide your Select District!" );
return false;
}
if( document.StudentRegistration.State.value == "-1" )
{
alert( "Please provide your Select State!" );
return false;
}
if( document.StudentRegistration.pincode.value ==""||
isNaN( document.StudentRegistration.pincode.value) ||
document.StudentRegistration.pincode.value.length != 6 )
{
alert( "Please provide a pincode in the format ######." );
document.StudentRegistration.pincode.focus() ;
return false;
}
var email = document.StudentRegistration.emailid.value;
atpos = email.indexOf("@");
dotpos = email.lastIndexOf(".");
if (email == "" || atpos < 1 || ( dotpos - atpos < 2 ))
{
alert("Please enter correct email ID")
document.StudentRegistration.emailid.focus() ;
return false;
}
if( document.StudentRegistration.dob.value == "" )
{
alert( "Please provide your DOB!" );
document.StudentRegistration.dob.focus() ;
return false;
}
if( document.StudentRegistration.mobileno.value == "" ||
isNaN( document.StudentRegistration.mobileno.value) ||
document.StudentRegistration.mobileno.value.length != 10 )
{
alert( "Please provide a Mobile No inthe format 123." );
document.StudentRegistration.mobileno.focus() ;
return false;
}
return( true );
}
14.
<!DOCTYPE html>
<html>
<head>
<title>PHP insertion</title>
<link href="css/insert.css" rel="stylesheet">
</head>
<body>
<div class="maindiv">
<!--HTML Form -->
<div class="form_div">
<div class="title">
<h2>Insert Data In Database Using PHP.</h2>
</div>
<form action="insert.php" method="post">
<!-- Method can be set as POST for hiding values in URL-->
<h2>Form</h2>
<label>Name:</label>
<input class="input" name="name" type="text" value="">
<label>Email:</label>
<input class="input" name="email" type="text" value="">
<label>Contact:</label>
<input class="input" name="contact" type="text" value="">
<label>Address:</label>
<textarea cols="25" name="address" rows="5"></textarea><br>
<input class="submit" name="submit" type="submit" value="Insert">
</form>
</div>
</div>
</body>
</html>
<?php
$connection = mysql_connect("localhost", "root", ""); // Establishing
Connection with Server
$db = mysql_select_db("colleges", $connection); // Selecting Database from
Server
if(isset($_POST['submit'])){ // Fetching variables of the form which travels in
URL
$name = $_POST['name'];
$email = $_POST['email'];
$contact = $_POST['contact'];
$address = $_POST['address'];
if($name !=''||$email !=''){
//Insert Query of SQL
$query = mysql_query("insert into students(student_name, student_email,
student_contact, student_address) values ('$name', '$email', '$contact',
'$address')");
echo "<br/><br/><span>Data Inserted successfully...!!</span>";
}
else{
echo "<p>Insertion Failed <br/> Some Fields are Blank. ..!!</p>";
}
}
mysql_close($connection); // Closing Connection with Server
?>
15.
<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>
16.
import java.applet.*;
import java.awt.*;
<?xml-stylesheet href="classic.css"?>
<ARTICLE>
<HEADLINE>A Fairytale</HEADLINE>
<AUTHOR>John Brown</AUTHOR>
<PARA>
Onceuponatime, inakingdomcalledPansialivedabraveKing. Helovedto
play
<INSTRUMENT>flute</INSTRUMENT>
One fine day he called his ministers to hear him play the instrument.
</PARA>
</ARTICLE>
ARTICLE {
font-family: serif;
background: white; color: #003
}
AUTHOR {
font-size: large;
margin: 1em0
}
HEADLINE {
font-size: x-large;
margin-bottom: 1em
}
PARA {
text-indent: 1em;
text-align: justify
}
INSTRUMENT {
font-style: italic
}
18.
<?xml-stylesheet href="classic.css"?>
<ARTICLE>
<HEADLINE>A Fairytale</HEADLINE>
<AUTHOR>John Brown</AUTHOR>
<PARA>
Onceuponatime, inakingdomcalledPansialivedabraveKing. Helovedto
play
<INSTRUMENT>flute</INSTRUMENT>
One fine day he called his ministers to hear him play the instrument.
</PARA>
</ARTICLE>