HTML FORMS
Code:
<!DOCTYPE html>
<html>
<head>
<title>General Information Form</title>
</head>
<body style="text-align: center;">
<h2 style="font-size: 2em; font-weight: bold; color: #4CAF50; text-decoration: underline;">
General Information Form
</h2>
<form id="generalInfoForm" style="max-width: 600px; margin: auto; text-align: left;">
<div style="margin-bottom: 15px;">
<label for="name">Name:</label><br>
<input type="text" id="name" name="name" required style="width: 100%; padding: 10px;
border: 1px solid #ccc; border-radius: 4px;">
</div>
<div style="margin-bottom: 15px;">
<label for="email">Email:</label><br>
<input type="email" id="email" name="email" required style="width: 100%; padding: 10px;
border: 1px solid #ccc; border-radius: 4px;">
</div>
<div style="margin-bottom: 15px;">
<label for="phone">Phone Number:</label><br>
<input type="tel" id="phone" name="phone" required style="width: 100%; padding: 10px;
border: 1px solid #ccc; border-radius: 4px;">
</div>
<div style="margin-bottom: 15px;">
<label for="address">Address:</label><br>
<input type="text" id="address" name="address" required style="width: 100%; padding: 10px;
border: 1px solid #ccc; border-radius: 4px;">
</div>
<div style="margin-bottom: 15px;">
<label for="bloodGroup">Blood Group:</label><br>
<input type="text" id="bloodGroup" name="bloodGroup" required style="width: 100%;
padding: 10px; border: 1px solid #ccc; border-radius: 4px;">
</div>
<div style="margin-bottom: 15px;">
<label for="fathersName">Father's Name:</label><br>
<input type="text" id="fathersName" name="fathersName" required style="width: 100%;
padding: 10px; border: 1px solid #ccc; border-radius: 4px;">
</div>
<div style="margin-bottom: 15px;">
<label for="mothersName">Mother's Name:</label><br>
<input type="text" id="mothersName" name="mothersName" required style="width: 100%;
padding: 10px; border: 1px solid #ccc; border-radius: 4px;">
</div>
<div style="margin-bottom: 15px;">
<label for="fatherOccupation">Father's Occupation:</label><br>
<input type="text" id="fatherOccupation" name="fatherOccupation" required style="width:
100%; padding: 10px; border: 1px solid #ccc; border-radius: 4px;">
</div>
<div style="margin-bottom: 15px;">
<label for="motherOccupation">Mother's Occupation:</label><br>
<input type="text" id="motherOccupation" name="motherOccupation" required
style="width: 100%; padding: 10px; border: 1px solid #ccc; border-radius: 4px;">
</div>
<div style="margin-bottom: 15px;">
<label for="comments">Additional Comments:</label><br>
<textarea id="comments" name="comments" rows="4" required style="width: 100%;
padding: 10px; border: 1px solid #ccc; border-radius: 4px;"></textarea>
</div>
<button type="submit" style="padding: 10px 15px; background-color: #4CAF50; color: white;
border: none; border-radius: 4px; cursor: pointer;">Submit</button>
</form>
</body>
</html>
OUTPUT:
