<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="[Link]" />
<frame src="[Link]" />
</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
