GREENWOOD PUBLIC SCHOOL
ADITYAPURAM, GWALIOR (M.P.)
SESSION 2024-2025
CLASS 10TH
PROJECT ON (HTML) WEB PAGES
SUBMITTED TO: SUBMITTED BY:
MR. GAJENDRA SINGH -----------------------
SECTION “………”
CERTIFICATE
This is to certify that Master/Miss
of Class X has successfully completed the HTML WEB PAGES (COMPUTER)
project as per the guidelines of CBSE for Class X Board examination. It is further
certified that this project is the individual and bonafide work of the candidate.
Teacher’s Name: Mr. Gajendra Singh
External Sign:
ACKNOWLEDGEMENT
I would like to convey my heartfelt thanks to Mr. Gajendra Singh
who guided me through the project, also gave valuable suggestions and guidance
for completing the project. He / She helped me to understand the intricate issues
involved in making the project, besides effectively presenting it. These intricacies
would have been lost otherwise. My project has been successful only because of
his / her guidance.
[1] Create an HTML Basic Web page using basic tags and formatting tags. Write a
paragraph with proper headings and subheadings and relevant text with some
images.
<html>
<head>
<title>Webpage for Computer and its Introduction.</title>
</head>
<body bgcolor="cyan">
<u><b><h1 align="center" > Computer</h1></b></u>
<p> As we know that computer has changed our life. Nowdays
computers are essential in every
field,before <i><b>globalization </b></i>we were not aware of the
importance of computers.But the <i>
internet</i>is playing a major role because by
using it we are very close to each other and <u> <b>communicate</b> </u>
anywhere.
</p>
Nowdays <i>internet</i> is like o<sub>2</sub>for people .
They cannot imagine their life without the internet.Actually ,
its helps users to acquire new skills with a<sup>2</sup> speed.
<ol>
<li>Computer Fandamentals</li>
<li>Software</li>
<li><strike>Internet</strike></li>
<li>Hardware</li>
</ol>
</body>
</html>
[2] Prepare a list in HTML as given below:
1. Educational Movie
o 3 Idiots
o Tare jamin par
o Chalk n duster
o Pathshala
2. Educational Web Series
o Kota Factory
o Lakho me ek
o Engineering girls
3.Cultural Movies
o Family Drama
o Hum sath sath hai
o Hum apke hai kon
o Vivah
4.Indian Calture
o Lagaan
o Pardesh
<html>
<head>
<title>html list </title>
<head>
<body bgcolor="lightgreen">
<ol>
<li>Educational Movies</li>
<ul>
<li>3 Idiots</li>
<li> Tare jamin par</li>
<li>Chalk n duster</li>
<li>Pathshala</li>
</ul>
<li>Educational Web series</li>
<ul>
<li>Kota Factory</li>
<li> Lakho me ek </li>
<li>Engineering girls</li>
</ul>
<li>Cultural Movies</li>
<ul>
<li>Family Drama</li>
<li>Hum sath sath hai</li>
<li> Hum apke hai kon </li>
<li>Vivah</li>
</ul>
<li>Indian Culture</li>
<ul>
<li>Lagaan</li>
<li> Pardesh </li>
</ul>
</ol>
</body>
</html>
[3] Create the table given below in HTML.
<html>
<head>
<title>HTML Table Cellpadding</title>
</head>
<body bgcolor="skyblue">
<table border="1" cellpadding="5" cellspacing="5" align="center" height="400"
width="700">
<tr>
<th rowspan="3" ><font size="50px">Day</font></th>
<th colspan="3">Seminar</th>
</tr>
<tr>
<th colspan="2">Schedule</th>
<th rowspan="2">Topic</th>
<tr>
<th>Begin</th><th>End</th>
</tr>
<tr>
<td rowspan="2">Monday</td>
<td rowspan="2" bgcolor="lightgreen">8:00 a.m.</td>
<td rowspan="2" bgcolor="lightgreen">5:00 p.m.</td>
<td >Introduction to XML</td>
<tr><td >Validity: DTD and Relax NG</td>
<tr>
<td rowspan="3">Tuesday</td>
<td bgcolor=”lightgreen">8:00 a.m.</td>
<td bgcolor="lightgreen">11:00 a.m.</td>
<td >XPath</td><tr>
<td bgcolor="lightgreen">11:00 a.m.</td>
<td bgcolor="lightgreen"> 2:00 p.m.</td>
<td rowspan="2"> XSL Transformatics</td>
<tr><td bgcolor="lightgreen">2:00 p.m.</td>
<td bgcolor="lightgreen">5:00 p.m.</td>
</tr>
<tr>
<td>Wednesday</td>
<td bgcolor="lightgreen">8:00 a.m.</td>
<td bgcolor="lightgreen">12:00 p.m.</td>
<td>XSL Formatting Objects</td>
</tr>
</table>
</body>
</html>
[4] Create the following form in HTML:
<html>
<head>
<title>Webpage for Computer and its Introduction.</title>
</head>
<body bgcolor="lightgreen">
<form>
First Name: <input type ="text"> <br>
Last Name: <input type ="text"> <br>
School:<input type ="text"> <br>
We must have a correct email address to send you the newsletter.<br>
Email: <input type ="text"> <br>
How did you here about us from?<br>
<input type="radio" name=r1 > Here on the web. <input type="radio" name=r1 > In a
magazine
<input type="radio" name=r1 > Newspaper story <input type="radio" name=r1 > Other
<br>
Would you care to be on our regular mailing list? <br>
<input type="checkbox" name=ch1 > <br>
Which are the games you like to play?<br>
<select class="combo">
<option value="Select">Select</option>
<option value="Cricket">Cricket</option>
<option value="Footboll">Footboll</option>
<option value="Vollyboll">Vollyboll</option>
<option value="Hockey">Hockey</option>
</select><br>
Enter comments about this website.<br>
<textarea name="suggest" rows=5 colS=70 wrap > </textarea> <br><br>
<input type="button" value="Submit">
<input type="button" value="Reset">
</form>
</body>
</html>
[5] Create HTML web Page with Link:
Develop following HTML pages with inter links to each other
1. Home.html
2. Aboutus.html
3. Services.html
4. Career.html
<html>
<head>
<title>Webpage for link.</title>
<style>
h1
{
color:red;
font-family:Papyrus;
font-size:50;
}
h3
{
color:red;
font-family:Oldbook;
font-size:20;
}
</style>
</head>
<body bgcolor="Lightgreen">
<h1 align="center" > Greenwood Public School </h1>
<h3 align="center">Adityapuram Gwalior</h3>
<br>
<center>
<a href="home.html"> Home</a>    
<a href="about us.html">About us </a>    
<a href="facility.html"> Facility</a>    
<a href="transport.html"> Transport</a>    
<a href="academic.html">Academic </a>    
<a href="career.html">Career </a>    
<a href="contact us.html"> Contact us</a>
</center>
</body>
</html>
<html>
<head>
</haed>
<body>
<img src="home.jpg">
</body>
</html>
<html>
<head>
</haed>
<body>
<img src="about us.jpg">
</body>
</html>
<html>
<head>
</haed>
<body>
<img src="facility.jpg">
</body>
</html>
<html>
<head>
</haed>
<body>
<img src="transport.jpg">
</body>
</html>
<html>
<head>
</haed>
<body>
<img src="academic.jpg">
</body>
</html>
<html>
<head>
</haed>
<body>
<img src="career.jpg">
</body>
</html>
<html>
<head>
</haed>
<body>
<img src="about us.jpg">
</body>
</html>
[6] Make mystyle.css file having following type of specification and link this file in
html file:
1. Body : background ivory
2. Paragraph : 12point, arial, brown font
3. Heading : 14-24point, arial, red font
4. Horizontal Rule : color=green / background image
5. Table : backgroundcolor=pink; border=2; text-align=right; color=brown;
<html>
<head>
<title> Webpage for creating table. </title>
<!----- here we are using internal CSS ---- >
<style>
h1
{
font-family:Arial ;
color: Red;
text-align:center;
}
p
{
font-family:Arial ;
color: Red;
text-align:center;
}
th
{
color:red;
font-family:papyrus;
font-size:22;
}
td
{
color:blue;
}
hr
{
border-top:1px dashed red;
}
</style>
</head>
<body bgcolor="lightgreen">
<h1 >Students Records.</h1>
<p> Computer Application.</p>
<table border="2" align="center" bgcolor="LightPink">
<tr>
<th>S.No.</th>
<th>Name</th>
<th>Address</th>
</tr>
<tr>
<td bgcolor= yellow>101</td>
<td bgcolor= yellow >Ram</td>
<td bgcolor= yellow >Gwalior</td>
</tr>
<tr>
<td bgcolor= lightyellow>102</td>
<td bgcolor= lightyellow>Shyam</td>
<td bgcolor= lightyellow>Gwalior</td>
</tr>
<tr>
<td bgcolor= cyan >103</td>
<td bgcolor= cyan>Mohan</td>
<td bgcolor= cyan>Gwalior</td>
</tr>
</table>
<hr>
</body>
</html>
Q.7 Write html code for creating given table with background page colour red and table
background color is light green.
<html>
<head><title>Demo for colspan and rowspan..</title>
</head>
<body bgcolor="red">
<table align="center"border="solidblack" width="40%"height ="50%"bgcolor="lightgreen">
<tr>
<th colspan="2">Name</th>
<th>Class</th>
<th>Address</th>
</tr>
<tr>
<td align="center">Aman</td>
<td>Rathore</td>
<td rowspan="3">10</td>
<td>Gwalior</td>
</tr>
<tr>
<td>Deepak</td>
<td>Sharma</td>
<td>Gwalior</td>
</tr>
<tr>
<td>Rajat</td>
<td>Goutam</td>
<td>Gwalior</td>
</tr>
</table>
</body>
</html>
Output:-
