IT Final Practical Exam Solution
IT Final Practical Exam Solution
1) AIM: Creation of website using HTML5 Create a website using HTML5 and CSS using any 4 CSS
properties. Write a code for 2 separate pages having different file names such as first page as Index.
html and second page as page2.html. Use any theme such as college profile or company profile etc.
Every page must contain proper Meta information and design web page as follows1) The index page
must contain a heading which is highest among other text on pages and must be at centre of the page.
There must be a paragraph which introduces general information about the theme chosen must have at
least 3 physical style tags and one image with alternate text. This page must be connected to other two
pages with proper navigational links. 2) The 2nd page must contain the feedback or enrolment form
related with theme chosen with features of HTML5. The form must contain text element and email
address of the company or person. Include the submit button.
Index.html
<!doctype html>
<html>
<head><title>homepage</title>
<meta charset="utf-8">
<meta name=college content="aided college">
<meta name=college content="unaided college">
<style>
body,img{font-family:"lucida handwriting"; border:solid; background-color:skyblue; font
size:12px}
</style> </head>
<body><center>
<h2 align=right><a href="page2.html"><b>"enroll now"<b></a></h2>
<img src="c:\users\sandip\pictures\saved pictures\college.jpg" height=250 width=500
alt="college" title="my college"><br><br>
<h1>best college in mumbai </h1>
<p><b><u><i>"A" <mark>Graded</mark> Colleges In Mumbai.
<br>You can select as per your choice</i></u></b></p> <br>
<h2> list of best college in mumbai </h2>
<a href="link1.html"><h3>aided </h3> </a>
<a href="link2.html"><h3>unaided </h3> </a>
</body></html>
Link1.html
<!doctype html>
<html>
<head>
<title>page 1</title>
<style>
h1,ol{font-family:"Lucida Handwriting"; border:solid; background-color:orange; font-size:20px}
</style>
</head>
<body>
<center>
<h1> LIST OF AIDED COLLEGE </H1>
<ol type=1>
<LI>THAKUR COLLEGE</LI>
<LI> DALMIA COLLEGE</LI>
<LI>SVP COLLEGE </LI>
<LI>SHAILENDRA COLLEGE</LI>
<LI>BALBHARTI COLLEGE </LI>
</ol>
</center> </body> </html>
Link2.html
<!doctype html>
<html>
<head>
<title>link 2</title>
<style>
h1,ul{font-family:"Lucida Handwriting"; border:solid; background-color:yellow; font-size:20px}
</style>
</head>
<body>
<br><br><br>
<h1> LIST OF UNAIDED COLLEGE </H1>
<ul type=CIRCLE>
<LI>NL COLLEGE</LI>
<LI> MATRUCHHAYA COLLEGE</LI>
<LI>MITHIBAI COLLEGE </LI>
<LI>BALBHARTI COLLEGE</LI>
<LI>MK COLLEGE </LI>
</ul>
</body> </html>
Page2.html
<!doctype html>
<html>
<head><title>ENROLLMENT FORM</title>
<style>
form,h1{font-family:"Lucida Handwriting"; border:solid; background-color:pink; font-size:20px}
</style></head>
<body><center>
<h1><u>ENROLLMENT FORM</u></h1>
<FORM action="">
FULL NAME :<input type=name><br><br>
CONTACT :<input type=tel><br><br>
ADDRESS : <textarea rows=2 cols=50></textarea> <br><br>
EMAIL_ID :<input type=email><br><br>
GENDER : <input type=radio name=X>MALE
<input type=radio name=X>FEMALE <br><br>
DOB : <input type=DATE><br><br>
STREAM : <SELECT>
<OPTION>SCIENCE </OPTION>
<OPTION>COMMERCE </OPTION>
<OPTION>ARTS </OPTION>
</SELECT> <BR><BR>
PHOTO : <input type=FILE><BR><BR>
SIGNATURE :<input type=FILE><BR><BR>
<input type=submit value=submit>
<input type=reset value=clear>
</form> </body> </html>
Q.2) AIM: Create a webpage using HTML and CSS code to design a web page as the layout displayed
below. The top section will display the heading , ‘Tourist places’ in header. The section on the left has
list of cities. The right hand side displays tourist places of any one of the city . Use Inline style sheet in
the top section to display background color for the text ‘Tourist places’. Use internal stylesheet for the
left and right section with background color and font styles.
Code:
<html>
<head><title> Tourist Place </title>
<style>
section{background-color:yellow; width:50%; height:50%; float:left; color:black; font-size:30px; outline
style:solid;}
aside{background-color:pink; width:50%; height:50%; float:right; color:black; font-size:30px; outline
style:solid;}
</style> </head>
<body>
<header style="background-color:lightblue; color:deeppink; text-align:center; height:30%;
width:100%; font-size:50px; outline-style:solid"><br>Tourist places </header>
<header>
<section>
<b> City </b>
<ol>
<li> Pune </li>
<li> Delhi </li>
<li> Banglore </li>
<li> Hyderabad </li>
</ol> </section>
<aside>
<p> Tourist places in Pune </p>
<ul>
<li> Shaniwarwada </li>
<li> Sinhgad </li>
<li> Kelkar Museum </li>
</ul>
</aside></header>
</body></html>
Q.5) AIM: Navigation on an image using Client side image Mapping in web page using html 5. Create a
webpage named imagemap.html with an inserted image having jpeg, png or gif extension. Create 3
different shapes (like rectangle, circle and polygon) which do not overlap. Note the co-ordinates making
use of Ms-Paint/GIMP/IrfanView/Pinta. Each shape should be mapped or navigate with a different URL
that should navigate to a local webpage.
Imagemap.html
<!doctype html>
<html>
<head>
<title>image mapping</title>
</head>
<body bgcolor=black>
<center>
<img src="Penguins.jpg" usemap=#abc>
<map name=abc>
<area shape="rect" coords="168,72,377,162" title="rectangle" href="rectangle.html">
<area shape="circle" coords="110,65,50,80" title="circle" href="circle.html">
<area shape="poly" coords="536,89,608,141,579,233,492,233,466,142" title="polygon"
href="polygon.html">
</map>
</body>
</html>
rectangle.html
<!doctype html>
<html>
<head>
<title> rectangle </title>
</head>
<body bgcolor=black text=white>
<br><br><br><br>
<center>
<h1>THIS IS RECTANGLE PAGE </h1>
</center> </body> </html>
Q.6) Aim : Create event driven JavaScript program to convert temperature to and
from Celsius, Fahrenheit.
(Formula: c/5= (f-32)/9)
[where c=Temperature in Celsius and f=Temperature in Fahrenheit.]
Output format : 40 Celsius=104 Fahrenheit
45 Fahrenheit = 7.22222222 Celsius
Code :
<html>
<head> <title> practical no. 7</title> </head>
<script language=javascript>
var c,f;
function feh()
{
f=prompt("enter the value for Fahrenheit","");
c=((f-32)/9)*5;
document.write(f + " Fehrenheit =" + c + " celsius" );
}
function cel()
{
c=prompt("enter value for celsius","");
f=((9*c)/5)+32;
document.write(c + " celsius= "+ f +" Fahrenheit");
}
</script>
<body bgcolor=orange><br><br>
<center>
<input type=button value="celsius" onclick="cel()">
<input type=button value="fehrenheit" onclick="feh()">
</body>
</html>
Q.7) AIM : Create JavaScript program which compute the average marks of
students. Accept six subject marks of student from user. Calculate
average marks of student which is used to determine the corresponding
grades.
Range Grade
35 to 60 F
61 to 70 D
71 to 80 C
81 to 90 B
91 to 100 A
Code :
<!DOCTYPE html>
<html>
<head>
<title>Enter Marks</title>
<script>
function marks()
{
var sub1 = parseInt(document.getElementById('s1').value);
var sub2 = parseInt(document.getElementById('s2').value);
var sub3 = parseInt(document.getElementById('s3').value);
var sub4 = parseInt(document.getElementById('s4').value);
var sub5 = parseInt(document.getElementById('s5').value);
var sub6 = parseInt(document.getElementById('s6').value);
var total = sub1+sub2+sub3+sub4+sub5+sub6;
var per = total/6;
var grade;
if (per>=35 && per<=60) {
grade = 'F';
}
else if(per>=61 && per<=70){
grade = 'D';
}
else if(per>=71 && per<=80){
grade = 'C';
}
else if(per>=81 && per<=90){
grade = 'B';
}
else if(per>=91 && per<=100){
grade = 'A';
}
else{
grade = "Invalid or Failed";
}
document.getElementById("demo").innerHTML = "Your Total Marks : "+total+"<br>Your Percentage :
"+per+"<br>Your Grade : "+grade;
}
</script>
</head>
<body>
<div id="demo"></div>
<h1>Enter Students Marks</h1>
<input type="text" id="s1" placeholder="Enter English Marks"><br>
<input type="text" id="s2" placeholder="Enter IT Marks"><br>
<input type="text" id="s3" placeholder="Enter OCM Marks"><br>
<input type="text" id="s4" placeholder="Enter Economics Marks"><br>
<input type="text" id="s5" placeholder="Enter Maths Marks"><br>
<input type="text" id="s6" placeholder="Enter Account Marks"><br>
<input type="submit" onclick="marks()">
<div id="demo"></div>
</body>
</html>
Q.8) AIM : Write a PHP program to check if a person is eligible to vote or not. The program should
include the following-
1) Minimum age required for vote is 18.
2) Use PHP functions.
3) Use Decision making statement.
<html>
<body bgcolor=orange>
<center><br><br><br>
<?php
function vote()
{
$name = "ABC";
$age = 19;
if ($age >= 18)
{
echo $name . ", You are eligible for Vote";
}
else
{
echo $name . ", You are not eligible for Vote. ";
}
}
vote();
?>
</center>
</body>
</html>