DWPD (3350702) 156380307529
Practical 1
Aim: - HTML codes for displaying image and demonstrate hyper-linking
Code:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>
<body>
<img src = "C:\Users\Public\Pictures\Sample Pictures\Chrysanthemum.jpg" image"
width = "125" height = "100"/>
<a href = "https://www.google.com/url?sa=i&source=images&cd=&ved=2ahUKEwiN-
9SQhPLiAhWXfisKHRF-CrQQjRx6BAgBEAU&url=https%3A%2F
%2Fsearchengineland.com%2Fgoogle-dropped-google-instant-search-
279674&psig=AOvVaw1Se8I-
nsvFPYddNtreYu1K&ust=1560912978222276"/>image</a>
</body>
</html>
Output
PIET-DS Page 1
DWPD (3350702) 156380307529
Practical 2
Aim: - Write html code to attach video on webpage using embed in html
<html>
<head>
<title> video </title>
</head>
<body>
<embed src="C:\Users\Public\Videos\Sample
Videos\Wildlife.wmv"height="450"width="250"/>
</body>
</html>
Output
PIET-DS Page 2
DWPD (3350702) 156380307529
Practical 3
Aim: - Create feedback form using form handling
<html>
<head>
<title>Feedback Form</title>
</head>
<body>
<form method="post" action="//submit.form" >
<div style="width: 400px;">
</div>
<div style="padding-bottom: 18px;font-size : 24px;">Student Feedback</div>
<div style="padding-bottom: 18px;font-size : 18px;">Please help us improve our courses by
filling out this form.</div>
<div style="display: flex; padding-bottom: 18px;width : 500px;">
<div style=" margin-left : 0; margin-right : 1%; width : 49%;">Teacher / Instructor first
name<br/>
<input type="text" id="data_3" name="data_3" style="width: 100%;" class="form-control"/>
</div>
<div style=" margin-left : 1%; margin-right : 0; width : 49%;">Teacher / Instructor last
name<br/>
<input type="text" id="data_4" name="data_4" style="width: 100%;" class="form-control"/>
</div>
</div><div style="display: flex; padding-bottom: 18px;width : 500px;">
<div style=" margin-left : 0; margin-right : 1%; width : 49%;">Subject<br/>
<input type="text" id="data_5" name="data_5" style="width: 100%;" class="form-control"/>
</div>
<div style=" margin-left : 1%; margin-right : 0; width : 49%;">Course code<br/>
<input type="text" id="data_6" name="data_6" style="width: 100%;" class="form-control"/>
PIET-DS Page 3
DWPD (3350702) 156380307529
</div>
</div><div style="padding-bottom: 18px;">Why did you chose this course?<br/>
<select id="data_7" name="data_7" style="width : 500px;" class="form-
control"><option>Degree requirement</option>
<option>Personal interest</option>
</select>
</div>
<div style="padding-bottom: 18px;">Level of knowledge on start of course<br/>
<select id="data_9" name="data_9" style="width : 500px;" class="form-
control"><option>Very good</option>
<option>Good</option>
<option>Fair</option>
<option>Poor</option>
<option>Very poor</option>
</select>
</div>
<div style="padding-bottom: 18px;">Level of effort invested in course<br/>
<select id="data_10" name="data_10" style="width : 500px;" class="form-
control"><option>Very good</option>
<option>Good</option>
<option>Fair</option>
<option>Poor</option>
<option>Very poor</option>
</select>
</div>
<div style="padding-bottom: 18px;">Level of knowledge at the end of the course<br/>
<select id="data_11" name="data_11" style="width : 500px;" class="form-
control"><option>Very good</option>
PIET-DS Page 4
DWPD (3350702) 156380307529
<option>Good</option>
<option>Fair</option>
<option>Poor</option>
<option>Very poor</option>
</select>
</div>
<div style="padding-bottom: 18px;">Level of communication<br/>
<select id="data_12" name="data_12" style="width : 500px;" class="form-
control"><option>Very good</option>
<option>Good</option>
<option>Fair</option>
<option>Poor</option>
<option>Very poor</option>
</select>
</div>
<div style="padding-bottom: 18px;">Would you recommend this course to other students?
<br/>
<select id="data_8" name="data_8" style="width : 500px;" class="form-
control"><option>Yes</option>
<option>No</option>
<option>Not sure</option>
</select>
</div>
<div style="padding-bottom: 18px;"><input name="skip_Submit" value="Submit"
type="submit"/></div>
<div style="padding-bottom: 18px;"><input name="skip_reset" value="reset"
type="reset"/></div>
</form>
</body>
PIET-DS Page 5
DWPD (3350702) 156380307529
</html>
Output:-
PIET-DS Page 6
DWPD (3350702) 156380307529
Practical 4
Aim: - Create feedback form using form handling
<html>
<head>
<title>Untitled Document</title>
</head>
<body bgcolor="black" style="color:#CC3300">
<h3> Contact form</h3>
<p> <pre>Please don't hesitate to contact me ifyou have ane question,comments</br>or
messages. I'll try to respond toeverything!</pre></p>
<div align="left">
<form action="#">
<table>
<tr>
<td>Name:</td>
<td> <input type="text" name="txt"/></td>
<td>
&nbs
p; &n
bsp; <b>Contact Information</b></td>
</tr>
<tr>
<td>Email: </td>
<td> <input type="email" name="em"/></td>
<td>
&nbs
p; &n
bsp; Telephone: +475637458 </td>
PIET-DS Page 7
DWPD (3350702) 156380307529
</tr>
<tr>
<td>Subject:</td>
<td> <input type="text" name="sub"/></td>
<td>
&nbs
p; &n
bsp; Email: [email protected] </td>
</tr>
<tr>
<td>Message:</td>
<td> <textarea rows="10" cols="21"></textarea></td>
<td>
&nbs
p; &n
bsp; Address: metro road,vadodara. </td>
</tr>
<tr>
<td>
<input type="submit" name="send" value="send"/>
</td>
</tr>
</table><br />
</form>
<p align="right ">hello</p>
</div>
PIET-DS Page 8
DWPD (3350702) 156380307529
</body>
</html>
Output:-
PIET-DS Page 9
DWPD (3350702) 156380307529
Practical-5
Aim:- Create static Parul University Webpage design using division tag
Code: Home page
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>parul university</title>
</head>
<body background="pu1.PNG" >
<div>
<h1> <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><center><a
href="login1.html"><b>Login</b></a><br />
<a href="regi.html"><b>Addmission form</b></a><br />
<a href="contact.html"><b>Contact Form</b></a></br>
<a href="student.html"><b>Feedfack</b></a></center>
</h1></div>
</body>
</html>
PIET-DS Page 10
DWPD (3350702) 156380307529
Output:-
Code: Login Page
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>parul university</title>
</head>
<body background="Home-page-2000-x-900-1.jpg" ></br></br></br></br>
<h1><center>Parul University </center></h1>
<form action="loginpage.html">
<center>
<table bgcolor="#FFFFFF" style="size:portrait">
<tr>
<td><b>Email:</b></td>
<td><input type="Email" name="Email"/></td>
</tr>
PIET-DS Page 11
DWPD (3350702) 156380307529
<tr>
<td><b>Password:</b></td>
<td><input type="Password" name="Password"/></td>
</tr>
<tr>
<td>
<a href="forgot.html">Forgot Password?</a>
</td>
<td>
<a href="regi.html">Sign up</a>
</td>
</tr>
</table>
              
 
<input type="Submit" name="Login" value="Login" /></center>
</form>
</body>
</html>
PIET-DS Page 12
DWPD (3350702) 156380307529
Output:-
Code:- Login successful
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title> Login page</title>
</head>
<body background="capture.jpg">
<h1><center>Login Successful</center></h1>
<p><h2><center>Welcome..! </br>
to the Parul University.</center></h2></pre>
</body>
</html>
PIET-DS Page 13
DWPD (3350702) 156380307529
Output:-
Code:- forgot password
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title> forgot</title>
</head>
<body>
<h1><center> Enter your E-Mail ID</center></h1>
<form action="regi.html">
<center><table>
<tr>
<td>E-Mail ID:</td>
PIET-DS Page 14
DWPD (3350702) 156380307529
<td><td><input type="Email" name="Email"/></td>
</tr>
<tr>
<td><input type="submit" name="submit"/></td>
</tr>
</table></center>
</form>
</body>
</html>
Output:-
PIET-DS Page 15
DWPD (3350702) 156380307529
Output:- registration Form
Output:- Contact Form
PIET-DS Page 16
DWPD (3350702) 156380307529
Output:- Feedback form
PIET-DS Page 17
DWPD (3350702) 156380307529
Practical:-6
Aim:-Write a code for design menu system of Notepad using list tag
Code:-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title> Menu System </title>
</head>
<body>
<font size="40"><h1> Notepad menu system</h1></font>
<font size="32">
<ol style="1">
<li><a href="file.html"> File</a></li>
<li><a href="edit.html">Edit</a></li>
<li><a href="format.html">Format</a></li>
<li><a href="view.html">View</a></li>
<li><a href="help.html">Help</a></li>
<ol></font>
</body>
</html>
PIET-DS Page 18
DWPD (3350702) 156380307529
Output:-
Code:-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title> Menu System </title>
</head>
<body>
<h1> File </h1>
<ul style="*">
<li> New </li>
<li> Open </li>
<li> Save </li>
<li> Save As </li>
<li> Close </li>
<li> Print </li>
PIET-DS Page 19
DWPD (3350702) 156380307529
</ul>
</body>
</html>
Output:-
Code:-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title> Menu System </title>
</head>
<body>
<h1> Edit </h1>
<ul style="*">
<li> Undo </li>
PIET-DS Page 20
DWPD (3350702) 156380307529
<li> Cut </li>
<li> Copy </li>
<li> Paste </li>
<li> Delete </li>
<li> Select All </li>
</ul>
</body>
</html>
Output:-
Code:-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title> Menu System </title>
</head>
PIET-DS Page 21
DWPD (3350702) 156380307529
<body>
<h1> Format </h1>
<ul style="*">
<li> Word wrap </li>
<li> Font </li>
</ul>
</body>
</html>
Output:-
Code:-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title> Menu System </title>
</head>
<body>
PIET-DS Page 22
DWPD (3350702) 156380307529
<h1> View </h1>
<ul style="*">
<li> Status bar </li>
</ul>
</body>
</html>
Output:-
Code:-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title> Menu System </title>
</head>
<body>
<h1> Help </h1>
<ul style="*">
<li> View help </li>
PIET-DS Page 23
DWPD (3350702) 156380307529
<li> About Notepad </li>
</ul>
</body>
</html>
Output:-
Practical 7
PIET-DS Page 24
DWPD (3350702) 156380307529
Aim:- Design Google Page using HTML 5
<html>
<head>
<title>Google</title>
</head>
<body>
<div style="margin-top:0px; margin-left:0px; margin-right:1000px; margin-bottom:100px;
padding-left:1300px"><a href="www.gmail.com">Gmail</a>
<a href="#">Images</a>
</div>
<center>
<img src="google.jpg" alt="google" height="200px" width="300px"/><br/>
<input type="search" size="80px" /><br/><br/>
<input type="submit" value="Google search"/>
<input type="submit" value="I'm feeling Lucky"/>
<br/>
<br/>
<label>Google Ofered in:</label>
<a href="#">Gujrati</a>
<a href="#">Hindi</a>
<a href="#">Marathi</a>
<a href="#">Tamil</a>
<a href="#">Telugu</a>
</center>
</body>
</html>
OUTPUT
PIET-DS Page 25
DWPD (3350702) 156380307529
PIET-DS Page 26
DWPD (3350702) 156380307529
Practical 8
Aim: - Apply CSS formatting to created pages & use readymade CSS
template
<html>
<head>
<title>CSS Template</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
box-sizing: border-box;
font-family: Arial, Helvetica, sans-serif;
body
margin: 0;
font-family: Arial, Helvetica, sans-serif;
.topnav
overflow: hidden;
background-color: #333;
.topnav a
float: left;
PIET-DS Page 27
DWPD (3350702) 156380307529
display: block;
color: #f2f2f2;
text-align: center;
padding: 14px 16px;
text-decoration: none;
.topnav a:hover
background-color: #ddd;
color: black;
.content
background-color: #ddd;
padding: 10px;
height: 200px;
.footer
background-color: #f1f1f1;
padding: 10px;
</style>
</head>
<body>
<div class="topnav">
PIET-DS Page 28
DWPD (3350702) 156380307529
<a href="#">Link</a>
<a href="#">Link</a>
<a href="#">Link</a>
</div>
<div class="content">
<h2>CSS Template</h2>
<p>A topnav, content and a footer.</p>
</div>
<div class="footer">
<p>Footer</p>
</div>
</body>
</html>
Output:
PIET-DS Page 29
DWPD (3350702) 156380307529
Practical 9
Aim:- Write a php script to print welcome message and also make
calculator using operators
<?php
echo "<h1><b>Welcome</b></h1>";
$a=16;
$b=8;
echo "<h1><b>Arithmatic Operators</b></h1>";
$cal="add";
switch($cal)
case "add":
$c=$a+$b;
echo "addition of two number is $c";
break;
case "sub":
$c=$a-$b;
echo "subtraction of two number is $c";
break;
case "mul":
$c=$a*$b;
echo "multiplication of two number is $c";
break;
case "div":
$c=$a/$b;
echo "division of two number is $c";
break;
PIET-DS Page 30
DWPD (3350702) 156380307529
default:
echo "exit";
break;
$x=5;
$y=5.0;
echo "<h1><b>Comparision operator</b></h1>";
echo"The value of x = $x";
echo"<br/>";
echo"The value of y = $y";
echo"<br/>";
if($x===$y)
echo"Using = = = The number is same";
else
echo"Using = = = The number is not same";
echo"<br/>";
if($x==$y)
echo"Using = = The number is same";
else
echo"Using = = The number is not same";
PIET-DS Page 31
DWPD (3350702) 156380307529
echo "<h1><b>logical Operators</b></h1><br/>";
$a = 42;
$b = 0;
if( $a && $b )
echo "TEST1 : Both a and b are true<br/>";
else
echo "TEST1 : Either a or b is false<br/>";
if( $a and $b )
echo "TEST2 : Both a and b are true<br/>";
else
echo "TEST2 : Either a or b is false<br/>";
if( $a || $b )
echo "TEST3 : Either a or b is true<br/>";
PIET-DS Page 32
DWPD (3350702) 156380307529
else
echo "TEST3 : Both a and b are false<br/>";
if( $a or $b )
echo "TEST4 : Either a or b is true<br/>";
else
echo "TEST4 : Both a and b are false<br/>";
$a = 10;
$b = 20;
if( $a )
echo "TEST5 : a is true <br/>";
else
echo "TEST5 : a is false<br/>";
if( $b )
PIET-DS Page 33
DWPD (3350702) 156380307529
echo "TEST6 : b is true <br/>";
else
echo "TEST6 : b is false<br/>";
if( !$a )
echo "TEST7 : a is true <br/>";
else
echo "TEST7 : a is false<br/>";
if( !$b )
echo "TEST8 : b is true <br/>";
else
echo "TEST8 : b is false<br/>";
?>
Output
PIET-DS Page 34
DWPD (3350702) 156380307529
PIET-DS Page 35
DWPD (3350702) 156380307529
Practical 10
Aim: - Write a php script to get type of variable using gettype()
and settype()
<? php
$i=1;
echo gettype($i);
settype($i,"string");
echo "<br/>";
echo gettype($i);
?>
Output
PIET-DS Page 36
DWPD (3350702) 156380307529
Practical 11
Aim: - Write a php script to set type of variable using type casting
<?php
$x = "Hello world!";
$y = 'Hello world!';
echo $x;
echo "<br>";
echo $y;
?>
Output
PIET-DS Page 37
DWPD (3350702) 156380307529
Practical 12
Aim : - Write php script to generate result and display grade
<?php
$a=50;
echo "Your Grade : ";
switch($a)
case $a>=90:
echo " A <br>";
break;
case $a>=80:
echo " B <br>";
break;
case $a>=70:
echo " C <br>";
break;
case $a>=50:
echo " D <br>";
break;
default:
echo " You are Fail";
break;
PIET-DS Page 38
DWPD (3350702) 156380307529
?>
Output
PIET-DS Page 39
DWPD (3350702) 156380307529
Practical 13
Aim: - Write php script for Fibonacci series and maximum out of three
numbers
<?php
$num = 0;
$n1 = 0;
$n2 = 1;
echo "<h3>Fibonacci series for first 12 numbers: </h3>";
echo "\n";
echo $n1.' '.$n2.' ';
while ($num < 10 )
$n3 = $n2 + $n1;
echo $n3.' ';
$n1 = $n2;
$n2 = $n3;
$num = $num + 1;
?>
Output
PIET-DS Page 40
DWPD (3350702) 156380307529
Aim: - Maximum out of three numbers
<?php
$a=20;
$b=10;
$c=1;
if($a>$b && $a>$c)
echo "Maximum value is a=".$a;
else if($b>$a && $b>$c)
echo "Maximum value is b=".$b;
else if($c>$a && $c>$b)
echo "Maximum value is c=".$c;
else
echo"Dont Enter Equal Values";
?>
Output
PIET-DS Page 41
DWPD (3350702) 156380307529
Practical 14
Aim: - Write php script to add 2*2 matrices
<?php
$a1 = Array('0' => Array('0' => 1,'1' => 2),'1' => Array('0' => 4,'1' => 5));
$a2 = Array('0' => Array('0' => 1,'1' => 2),'1' => Array('0' => 4,'1' => 5));
$sumArray = array();
$result = array();
for($i=0; $i<=1; $i++)
for($j=0; $j<=1; $j++)
$result[$i][$j] = $a1[$i][$j] + $a2[$i][$j];
echo "<pre/>";print_r($result);
?>
Output
PIET-DS Page 42
DWPD (3350702) 156380307529
PIET-DS Page 43