Scribd
Upload
5 views

HTML Programs to Study for Unit Tests

Uploaded by

a06664312
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
5 views

HTML Programs to Study for Unit Tests

Uploaded by

a06664312
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 3

HTML PROGRAMS TO STUDY FOR UNIT TESTS

Q: Write a program in HTML with following specifications:


 The background colour should be Green
 The text colour should be red
 The heading should be large in size as “My First Web Page”
 Display your name in Bold, address in italic and standard as 11th.

CODE Filename: MYSELF.HTML


<!DOCTYPE html>
<head>
<title> Myself </title>
</head>
<body bgcolor=lightgreen text=red align=center>
<h1> My First Webpage </h1>
<hr color=blue size="8" width="60%">
<b> Anamika Mishra </b> <br>
<i> 103, Greenland park, <br>
Mira Road(E) <br>
Thane </i><br>
<br>
I am in standard 11<sup>th</sup> <br>
</body>
</html>

Q2. Create a webpage with following specification:


 Display heading ‘Application Form’ in highest heading with center alignment.
 Accept Name, address and Standard 11th or 12th with only one selection choice.
 Submit the form.
CODE: filename: Applicationform.html
<html>
<head>
<title> Application FORM </title>
</head>
<body bgcolor="yellow">
<h1 align = "center"> APPLICATION FORM </h1>
<form>
First Name : <input type ="text" name="firstname">
Surname : <input type ="text" name="surname"> <br/><br>
Please enter your Address below : <br>
<textarea name="positive" rows=10 cols=20 placeholder ="your Address here" ></textarea> <br>
Class: <br/>
<input type ="radio" name ="Class" value ="FYJC"> FYJC <br>
<input type ="radio" name ="Class" value ="SYJC"> SYJC <br> <br><br><br>
<input type ="submit" value ="Send">
<input type ="reset" value="clear form">
</form></body> </html>
Q3. Create a table as shown below:

CLASS BOYS GIRLS


XI -science 10 20
XI -commerce 15 25

<! DOCTYPE html>


<html>
<head><title> Tables </title></head>
<body>
<table align = "center" border ="2" >
<tr align="center">
<th>CLASS </th>
<th>BOYS</th>
<th> GIRLS </th>
</tr>
<tr align ="center">
<td > XI -science </td>
<td> 10 </td>
<td> 20 </td>
</tr>
<tr align ="center">
<td> XI-commerce </td>
<td> 15 </td>
<td> 25</td>
</tr>
</table></body></html>

JAVASCRIPT PROGRAMS

1> To accept a number and check if it is odd or even

<!DOCTYPE html>
<html>
<head><title> odd /even </title></head>
<body>
<script language ="javascript">
var a,b;
a =prompt("Enter your value : ");
b=parseInt(a);
if(b%2==0)
alert("number is even");
else
alert("number is odd");
</script></body></html>

2>To accept a number and print its square

<html>
<head> <title> Multiplication </title></head>
<body bgcolor="yellow">
<script language="javascript">
var a,b; // defining the variables
a=prompt("enter a value : ");
b = a*a;
document.write("<br> square of "+a+" is " +b);
</script>
</body></html>
The same program using a function

<html>
<head> <title> Square function </title>
<script language="javascript">
function square(m)
{var x= m*m;
return(x);
}
</script>
</head>
<body bgcolor="yellow">
<h1> Program to square a number</h1>
<script language="javascript">
var a,b; // defining the variables
a=prompt("enter the number : ");
c=square(a);
document.write("<br> <h2> square of " +a+" = "+c+"</h2>");
</script></body></html>

3) Create two buttons and have event handlers such that the mouse moves over one
button the background colour changes and if someone clicks on the other button the
background colour changes.
<html>
<head> <title> To change colour using MouseOver</title></head>
<body>
<script language ="JavaScript">
function changeBG(color)
{document.bgColor=color;
}
</script>
<form>
<input type= "button" value="Move mouse over me" name="Yellow"
onMouseOver ="changeBG('Yellow')"
onMouseOut="changeBG('blue')"><br>
<input type= "button" value="click me" name="Green" onClick ="changeBG('Green')">
</form></body></html>

You might also like