Scribd
Upload
11 views39 pages

Practical Handbook

The document is a certificate and practical journal for students of Ajinkya Charitable Foundation’s Dr Asmita School, detailing their completion of Information Technology experiments for the academic year 2024-2025. It includes various HTML and JavaScript practicals, such as website creation, event-driven programming, and PHP applications. Each practical demonstrates different coding techniques and functionalities, such as form handling, audio and video embedding, and string manipulation.

Uploaded by

bmwm8222
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
11 views39 pages

Practical Handbook

The document is a certificate and practical journal for students of Ajinkya Charitable Foundation’s Dr Asmita School, detailing their completion of Information Technology experiments for the academic year 2024-2025. It includes various HTML and JavaScript practicals, such as website creation, event-driven programming, and PHP applications. Each practical demonstrates different coding techniques and functionalities, such as form handling, audio and video embedding, and string manipulation.

Uploaded by

bmwm8222
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 39

Roll No: Seat No:

Ajinkya Charitable Foundation’s


Dr Asmita Primary, Secondary And
Higher Secondary School
Department: Information Technology

Certificate
This is to certify that,
Mr./Miss. ___________________________________________
Of class XII Division ___________ Roll No_________
H.S.C. Board Examination Seat No____________ has satisfactory
completed required Experiments and Activities in subject
Information Technology prescribed by Maharashtra State Board,
this journal represents his/her Bonafide work during the
Academic year 2024-2025
Date:

Subject Incharge External Examiner Principal


Index
Sr.No. Practical Name Date Teacher
Sign
PRACTICAL NO:1
ROLL NO:
SEAT NO:
PRACTICAL NAME: Creation of website using HTML5
Index.html
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>Tata Group</title>
<style>
h1{border-style:dotted}
p{color:red;font-size:15pt}
body{background-color:pink}
b{text-decoration:overline}
u{text-align:right}
</style>
</head>
<body>
<h1 align="center">Tata Sons Private Limited</h1>
<p>
66% of the equity share capital of Tata Sons is held by philanthropic
<br>
trusts, which support education, health, livehood generation, <br>
and art and culture. Each Tata Comapny and supervision of its own
board <br>
independetly under the guidance and supervision of its own Board
<br>
of Directors.
</p>
<b>Governance Philosophy</b><br><br>
<i>Tata code of conduct</i><br><br>
<u>Tata Business Excellence Model (TBEM)</u><br><br>
<h3>Image of Tata Industries</h3>
<img src="D:\Factory.jpeg" width="50%" height="50%" alt="Factory
Image"><br><br>
<a href="second.html">Second Page</a>
</body>
</html>
Second.html
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>Forms</title>
<style>
h1{border-style:dashed}
body{background-color:aqua}
</style>
</head>
<body>
<h1 align="center">Enrollment Forms</h1>
<form name="f1">Enter your name
<input type="text" name="t1" required>
<br><br>
Enter your E-mail-id
<input type="text" name="emailid">
<br><br>
<input type="submit" name="submit" value="submit">
<br><br>
</form>
</body>
</html>
Output:
PRACTICAL NO:2
ROLL NO:
SEAT NO:
PRACTICAL NAME: Creation of website using HTML5 as display below
Tourist.html
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>sop2</title>
</head>
<body>
<header style="text-align:center;color:red;background-
color:skyblue;border:ridge">
<h1>Tourist Places</h1>
</header>
<section style="background-
color:yellow;width:49%;border:ridge;height:50%;float:left">
<h1>City</h1>
<ol>
<li>Pune</li>
<li>Banglore</li>
<li>Hydrabad</li>
<li>Delhi</li>
</ol>
</section>
<section style="background-
color:pink;width:50%;border:ridge;height:50%;float:right">
<h1>Tourist places in pune</h1>
<ul>
<li>Shanivar Wada</li>
<li>Kelkar Muesum</li>
<li>Sinhgad Fort</li>
<li>Dagdusheth Temple</li>
</ul>
</section>
</body>
</html>
Output:
PRACTICAL NO:3
ROLL NO:
SEAT NO:
PRACTICAL NAME: Create a website using HTML and CSS code to
design webpages as follows.
Page1.html
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>Travells</title>
</head>
<body bgcolor="yellow">
<h1 align="center">Traveller Information</h1>
<form name="f1">
Enter your name:<input type="text" name="name" id="nm"
autocomplete><br><br>
Select Date of Travell:<input type="date" name="date"
id="dt"><br><br>
Enter Telephone Number:<input type="Number" name="num"
id="no"><br><br>
<input type="submit" name="submit" value="submit">
</form>
<a href="page2.html">Click Here</a>
</body>
</html>
Page2.html
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>2nd page of SOP3</title>
</head>
<body bgcolor="aqua">
<h1>Information of Transporter</h1>
<ul>
<li>Name of Transporter: Air Asia</li>
<li>Time:09:30 am</li>
<li>Seat no: B29</li>
<li>Destination: Delhi</li>
</ul>
<a href="page1.html">Click Here</a>
</body>
</html>
Style.css
<style>
h1{color:pink;
}
body{
background-color:aqua;
font-style:bold;
}
</style>
Output:
PRACTICAL NO:4
ROLL NO:
SEAT NO:
PRACTICAL NAME: Create a website using HTML and CSS code to
design webpages as follows.
Audio.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-
scale=1">
<title>Audio with controls</title>
</head>
<body>
<h1>Single Audio File with control</h1>
<audio controls autoplay loop=-1>
<source src="C:\Downloads\sample-3s.mp3"
type="audio/mpeg">Your browser does not support the audio element
</audio>
</body>
</html>
Audio1.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-
scale=1">
<title>multiple audio with control</title>
</head>
<body>
<h1>Multiple audio files with control</h1>
<h3>List of sound file format</h3>
<li>mp3-audio/mpeg</li>
<li>ogg-audio/ogg</li>
<li>wav-audio/wav</li>
<audio controls autoplay loop=-1>
<source src="C:\sample-3s.mp3" type="audio/mpeg">
<source src="C:\sample-6s.mp3" type="audio/mpeg">
<source src="C:\ample-9s.mp3"
type="audio/mpeg">
your browser does not support the audio element

</body>
</html>
Output:
PRACTICAL NO:5
ROLL NO:
SEAT NO:
PRACTICAL NAME: Use of Video on web pages using HTML5
Video.html
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>Single Video with Control</title>
</head>
<body>
<h1>Single video file on web page with controls</h1>
<video controls width="150" height="150" controls loop=-1 autoplay>
<source src="C:\2253585-uhd_3840_2160_24fps.mp4"
type="video/mp4">
Your browser does not support the videio tag.
</video>
</body>
</html>
Video1.html
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>Multiple video with control</title>
</head>
<body>
<h1>Multiple Video</h1>
<video controls autoplay height="150" width="150">
<source src="C:\2253585-uhd_3840_2160_24fps.mp4"
type="video/mp4">
<source src="C:253585-uhd_4840_3160_34fps.mp4"
type="video/mp4">
<source src="C:253585-uhd_5840_4160_44fps.mp4"
type="video/mp4">
</video>
</body>
</html>
Output:
PRACTICAL NO:6
ROLL NO:
SEAT NO:
PRACTICAL NAME: Create event driven JavaScript program to count
number of vowels in the given string
Vowels.html
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>String Function</title>
</head>
<body>
<form name="f1">
Enter String: <input type="text" name="t1"><br><br>
<input type="submit" name="s1" value="Count Vowels"
onclick="return countvowel()">
</form>
<script language="javascript" type="text/javascript">
function countvowel() {
var s, i, ch, c;
c = 0;
s = document.f1.t1.value;
for (i = 0; i < s.length; i++) {
ch = s.charAt(i);
if (ch == "A" || ch == "a" ||
ch == "E" || ch == "e" ||
ch == "I" || ch == "i" ||
ch == "O" || ch == "o" ||
ch == "U" || ch == "u") {
c++;
}
}
alert("Number of Vowels in String are " + c);
return false; // Prevent form submission
}
</script>
</body>
</html>
Output:
PRACTICAL NO:7
ROLL NO:
SEAT NO:
PRACTICAL NAME: Create event driven JavaScript program to check
whether string is palindrome or not.
Palindrome.html
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>Palindrome</title>
</head>
<body>
<form name=f1>
Enter String:<input type="text" name="t1"><br><br>
<input type="submit" name="s1" value="Check Palindrome"
onclick="display()">
</form>
<script language="javascript" type="text/javascript">
function display()
{
var a,s,i,ch,n,p
a=document.f1.t1.value
s=a.toLowerCase()
n=s.length
p=1
for(i=0;i<n/2;i++)
{ if(s.charAt(i)!=s.charAt(n-1-i)){
p=0
break
}

}
if (p==1)
alert("String is Palindrome")
else
alert("String is not Palindrome")
}
</script>
</body>
</html>
Output:
PRACTICAL NO:8
ROLL NO:
SEAT NO:
PRACTICAL NAME: Create event driven JavaScript program to convert
temperature to Celsius into Fahrenheit.
Conversion.html
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>Celsius to Fahrenheit</title>
</head>
<body>
<h1>Celsius to Fahrenheit Conversion</h1>
<p>Insert a number into one of the input fields below:</p>
<p><input type="text" id="c" onkeyup="convert('c')"> Degree
Celsius</p>
<p><input type="text" id="f" onkeyup="convert('f')"> Degree
Fahrenheit</p>
<script type="text/javascript">
function convert(degree){
var x;
if (degree == "c"){
x = document.getElementById("c").value * 9 / 5 +
32;
document.getElementById("f").value =
Math.round(x);
}
else{
x = (document.getElementById("f").value - 32) * 5 /
9;
document.getElementById("c").value =
Math.round(x);
}
}
</script>
</body>
</html>
Output:
PRACTICAL NO:9
ROLL NO:
SEAT NO:
PRACTICAL NAME: Create event driven JavaScript to display grade of
student
Grade.html
<!DOCTYPE html>
<html lang="en-US">
<head>
<title>Grade</title>
</head>
<body>
<form name="f1">
Enter Marks of English
<input type="number" name="t1"><br><br>
Enter Marks of Mathematics
<input type="number" name="t2"><br><br>
Enter Marks of Physics
<input type="number" name="t3"><br><br>
Enter Marks of Chemistry
<input type="number" name="t4"><br><br>
Enter Marks of IT
<input type="number" name="t5"><br><br>
<input type="button" name="btnclick" value="Print Grade"
onclick="grade()">
</form>
<script type="text/javascript">
function grade(){
var m1, m2, m3, m4, m5, a;
// Convert the input values to numbers using parseFloat
m1 = parseFloat(document.f1.t1.value);
m2 = parseFloat(document.f1.t2.value);
m3 = parseFloat(document.f1.t3.value);
m4 = parseFloat(document.f1.t4.value);
m5 = parseFloat(document.f1.t5.value);

// Calculate the average


a = (m1 + m2 + m3 + m4 + m5) / 5;

alert("Average marks of student is " + a);

// Determine grade based on average


if (a >= 91){
alert("Grade A");
}
else if (a >= 81){
alert("Grade B");
}
else if (a >= 71){
alert("Grade C");
}
else if (a >= 61){
alert("Grade D");
}
else{
alert("Grade F");
}
}
</script>
</body>
</html>
Output:
PRACTICAL NO:10
ROLL NO:
SEAT NO:
PRACTICAL NAME: Write a PHP program to check if a person is eligible
to vote or not
Age.html
<!DOCTYPE html>
<html>
<head>
<title>TO vote or not</title>
</head>
<body>
<form method="post" action="age.php">
Enter Your Age
<input type="text" name="t1"><br><br>
<input type="submit" name="submit" value="Check Eligible">
</form>
</body>
</html>
Age.php
<?php
if (isset($_POST['submit'])) {
$age = $_POST['t1'];

if ($age >= 18) {


echo "<br><br> You are Eligible to vote";
} else {
echo "<br><br> You are not Eligible to vote";
}
}
?>
Output:
PRACTICAL NO:11
ROLL NO:
SEAT NO:
PRACTICAL NAME: Write a PHP function to count the total number of
vowels
Vowels.php
<?php if(isset($_POST['Submit'})
{
$str=strtolower($_POST['str']);
$vowels=array('a','e','i','o','u');
$len=strlen($str);
$num=0;
for($i=0;$i<$len;
$i++)
{
if(in_array($Str[$i],
$vowels))
{
$num++;
}
}
echo "Number of vowels:.$num";
?>
Output:
PRACTICAL NO:11
ROLL NO:
SEAT NO:
PRACTICAL NAME: Write a PHP function to display marks of individual
subject along with total marks and percentage.
Marks.php
<?php
$a = array(60, 75, 45, 42, 79, 56);
$t = 0;
$x = 0;
$c = count($a);

for ($x = 0; $x < $c; $x++) {


echo "<br><br>Marks in Subject: $a[$x]";
$t += $a[$x];
}

$p = ($t / 500) * 100;


echo "<br><br>
Total is: $t";
echo "<br><br>
Percentage is: $p";
?>
Output:

You might also like