Scribd
Upload
12 views

HTML Source Code

Uploaded by

Sowmya Vasireddy
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
12 views

HTML Source Code

Uploaded by

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

<html lang="en">

<head><title>HTML form with five basic features</title>


<script>
function fun1(){
alert("Successfully Registered!!");
}
</script>
</head>
<body>
<center>
<h1>HTML form with five basic features</h1>
<form action="submit_form.php" method="post">
<label for="name">Name:</label>
<input type="text" id="name" name="user_name">
<br><br>
<label for="email">Email:</label>
<input type="email" id="email" name="user_email">
<br><br>
<label for="password">Password:</label>
<input type="password" id="password" name="user_password">
<br><br>
<label for="gender">Gender:</label>
<input type="radio" id="male" name="gender" value="male">
<label for="male">Male</label>
<input type="radio" id="female" name="gender" value="female">
<label for="female">Female</label>
<br><br>
<input type="button" value="Submit" onclick="fun1()">
</form>
</center>
</body>
</html>

Output:

HTML form with five basic features


Name: 

Email: 

Password: 

Gender:   Male   Female


2a.

<html>
<head>
<title>Multiple Frames Example</title>
</head>
<frameset cols="50%, 50%">
<frame src="frame1.html" />
<frame src="frame2.html" />
</frameset>
</html>

2b

<!DOCTYPE html>
<html>
<head>
<style>
h1, h2 {
padding: 0.5em;
border-style: groove;
margin: 0.5em;
}
</style>
</head>
<body>
<h1>Welcome to Web Technologies</h1>
<h2>This is HTML page</h2>
</body>
</html>

Welcome to Web Technologies


This is html page
3a.
<html>
<head>
<title>Basket Ball scores</title>
<style>
.one{
font-size : 40px;
color:DodgerBlue;
font-family : Comic Sans MS;
}
.two{
font-size : 25px;
color:SlateBlue;
font-family:Arial Black;
}
.three{
font-size : 25px;
color:MediumSeaGreen;
font-family:verdana;
}
.four{
font-size : 25px;
color:Tomato;
font-family:verdana
}
</style>
</head>
<body>
<table border="1px" align="center">
<tr>
<th>Team Name</th>
<th>Points</th>
<th>Status</th>
</tr>
<tr class="one">
<td>Andhra Pradesh</td>
<td>26</td>
<td>Winner</td>
</tr>
<tr class="two">
<td>Hyderabad</td>
<td>20</td>
<td>Runner Up</td>
</tr>
<tr class="three">
<td>Kerala</td>
<td>18</td>
<td>Semis</td>
</tr>
<tr class="four">
<td>Chennai</td>
<td>14</td>
<td>Semis</td>
</tr>
</table>
</body>
</html>

Team Name Points Status

Andhra Pradesh 26Winner


Hyderabad 20 Runner Up
Kerala 18 Semis
Chennai 14 Semis
4b.
<html lang="en">
<head>

<title>Five classes of paragraph</title>


<style>
.para1 {
background-color: lightblue;
color: white;
margin: 20px;
padding: 10px;
border: 2px solid blue;
}
.para2 {
background-color: pink;
color: black;
margin: 30px;
padding: 15px;
border: 2px dotted pink;
}
.para3 {
background-color: yellow;
color: green;
margin: 40px;
padding: 20px;
border: 2px solid green;
}
.para4 {
background-color: lightgray;
color: black;
margin: 50px;
padding: 25px;
border: 2px dotted gray;
}
.para5 {
background-color: orange;
color: white;
margin: 60px;
padding: 30px;
border: 2px solid orange;
}
</style>
</head>
<body>
<p class="para1">This is paragraph 1</p>
<p class="para2">This is paragraph 2</p>
<p class="para3">This is paragraph 3</p>
<p class="para4">This is paragraph 4</p>
<p class="para5">This is paragraph 5</p>
</body>
</html>

This is paragraph 1

This is paragraph 2

This is paragraph 3
This is paragraph 4

This is paragraph 5

You might also like