Hardik Bakshi
210010800018
Exercise 1: Basic HTML Structure Create an HTML document with the following
structure:
Title: "My First HTML Page"
Head: Contains the title element.
Body: Contains a heading (h1) that says "Hello, Polytechnic Students!" and a
paragraph (p) with some introductory text.
<!DOCTYPE html>
<html>
<head>
<title>My First HTML Page</title>
</head>
<body>
<h1>Hello, Polytechnic Students!</h1>
<p>Welcome to the world of HTML. This is your first HTML page.</p>
</body>
</html>
Exerc
Hardik Bakshi
210010800018
ise 2: Links and Images Create an HTML document with a link (a) that goes to a website of your
choice and an image (img) that is displayed on the page.
Solution 2:
<!DOCTYPE html>
<html>
<head>
<title>Links and Images</title>
</head>
<body>
<h1>Visit Our Website</h1>
<a href="[Link] target="_blank">Click here to visit [Link]</a>
<h2>Our Logo</h2>
<img src="[Link]" alt="Company Logo" width="200" height="100">
</body>
</html>
Hardik Bakshi
210010800018
Exercise 3 Create an HTML file with a table.
The table should have three columns: Name, Age, and City.
Add at least three rows of data to the table.
Style the table using CSS to make it visually appealing.
<!DOCTYPE html>
<html>
<head>
<style>
table {
border-collapse: collapse;
width: 50%;
margin: 20px auto;
th, td {
border: 1px solid #ddd;
padding: 8px;
text-align: left;
th {
background-color: #f2f2f2;
</style>
</head>
<body>
<table>
<tr>
<th>Name</th>
Hardik Bakshi
210010800018
<th>Age</th>
<th>City</th>
</tr>
<tr>
<td>John Doe</td>
<td>25</td>
<td>New York</td>
</tr>
<tr>
<td>Jane Smith</td>
<td>30</td>
<td>Los Angeles</td>
</tr>
<tr>
<td>Bob Johnson</td>
<td>22</td>
<td>Chicago</td>
</tr>
</table>
</body>
</html>
Hardik Bakshi
210010800018
Exercise 4: Basic CSS Styling Style the HTML document from Exercise 1 with the
following CSS rules:
Set the background color of the <body> to light blue.
Change the text color of the <h1> to red.
Add a border around the image.
Change the font size of the paragraph to 16px.
<!DOCTYPE html>
<html>
<head>
<title>My First Web Page</title>
<style>
body {
background-color: lightblue;
h1 {
color: red;
img {
border: 2px solid black;
p{
font-size: 16px;
</style>
</head>
<body>
<h1>Welcome to My Website</h1>
Hardik Bakshi
210010800018
<p>This is my first web page. It's a simple example to get started with HTML and CSS.</p>
<img src="[Link]" alt="Image Description">
<a href="[Link] [Link]</a>
</body>
</html>
Hardik Bakshi
210010800018
Exercise 5 : Make a HTML form for user information
<!DOCTYPE html>
<html>
<head>
<title>User Information Form</title>
<style>
.form{
border: 2px solid black;
background-color: rgb(0, 174, 255);
</style>
</head>
<body style="display:flex; background-color: blue;">
<div class="form"> <form action="[Link]” target= “_blank”
method="post">
<h1 style="text-align: center;">User info Form</h1>
<fieldset>
<legend>User Information</legend>
<label for="name">Name:</label>
<input type="text" id="name" ><br><br>
<label for="email">Email:</label>
<input type="email" id="email" ><br><br>
<label for="dob">Date of Birth:</label>
<input type="date" id="dob" ><br><br>
<label>Area of Interest:</label><br>
Hardik Bakshi
210010800018
<input type="radio" id="interest1" >
<label for="interest1">Technology</label><br>
<input type="radio" id="interest2" >
<label for="interest2">Sports</label><br>
<input type="radio" id="interest3" >
<label for="interest3">Music</label><br><br>
</fieldset>
<fieldset>
<legend>Hobbies</legend>
<input type="checkbox" id="hobby1" >
<label for="hobby1">Reading</label><br>
<input type="checkbox" id="hobby2>
<label for="hobby2">Traveling</label><br>
<input type="checkbox" id="hobby3" >
<label for="hobby3">Gardening</label><br><br>
</fieldset>
<fieldset>
<legend>Address</legend>
<label for="address">Address:</label><br>
<textarea id="address" name="address" rows="4" cols="50"
required></textarea><br><br>
</fieldset>
<center> <input type="submit" value="Submit"></center>
</form>
Hardik Bakshi
210010800018
</div>
</body>
</html
