Create a web page to create a form using CSS that includes tables and user interface components such as text boxes, text areas, buttons, check boxes and combo box. Create a feedback form to enable students to give their feedback regarding the teacher
<!DOCTYPE html>
<html>
<head>
<title>Teacher Feedback Form</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
}
h1 {
text-align: center;
}
table {
margin: 0 auto;
}
td {
padding: 5px;
}
input[type="text"],
textarea {
width: 300px;
}
select {
width: 320px;
}
.submit-btn {
margin-top: 10px;
text-align: center;
}
</style>
</head>
<body>
<h1>Teacher Feedback Form</h1>
<form>>
<table>
<tr>
<td>Name:</td>
<td><input type="text" name="name"></td>
</tr>
<tr>
<td>Email:</td>
<td><input type="text" name="email"> </td>
</tr>
<tr>
<td>Subject:</td>
<td><input type="text" name="subject"></td>
</tr>
<tr>
<td>Message:</td>
<td><textarea name="message" rows="5"></textarea></td>
</tr>
<tr>
<td>Rating:</td>
<td>
<select name="rating">
<option value="5">Excellent</option>
<option value="4">Very Good</option>
<option value="3">Good</option>
<option value="2">Fair</option>
<option value="1">Poor</option>
</select>
</td>
</tr>
<tr>
<td>Recommend:</td>
<td>
<input type="checkbox" name="recommend" value="yes"> Yes
</td>
</tr>
</table>
<div class="submit-btn">
<input type="submit" value="Submit">
</div>
</form>
</body>
</html>
With Css
<!DOCTYPE html>
<html>
<head>
<title>Teacher Feedback Form</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
}
h1 {
text-align: center;
}
table {
margin: 0 auto;
}
td {
padding: 5px;
}
input[type="text"],
textarea {
width: 300px;
}
select {
width: 320px;
}
.submit-btn {
margin-top: 10px;
text-align: center;
}
</style>
</head>
<body>
<h1>Teacher Feedback Form</h1>
<form>>
<table>
<tr>
<td>Name:</td>
<td><input type="text" name="name"></td>
</tr>
<tr>
<td>Email:</td>
<td><input type="text" name="email"></td>
</tr>
<tr>
<td>Subject:</td>
<td><input type="text" name="subject"></td>
</tr>
<tr>
<td>Message:</td>
<td><textarea name="message" rows="5"></textarea></td>
</tr>
<tr>
<td>Rating:</td>
<td>
<select name="rating">
<option value="5">Excellent</option>
<option value="4">Very Good</option>
<option value="3">Good</option>
<option value="2">Fair</option>
<option value="1">Poor</option>
</select>
</td>
</tr>
<tr>
<td>Recommend:</td>
<td>
<input type="checkbox" name="recommend" value="yes"> Yes
</td>
</tr>
</table>
<div class="submit-btn">
<input type="submit" value="Submit">
</div>
</form>
</body>
</html>
Save the code in an HTML file, and you can open it in a web browser to see your biodata webpage. Remember to include your photo file (e.g., your_photo.jpg) in the same directory as the HTML file or provide the correct file path in the src attribute of the img tag.