0% found this document useful (0 votes)
42 views2 pages

Registration

The document contains an HTML registration form with various input fields for a user to enter personal information like name, email, phone number, birthdate, gender, and address. The form uses CSS for styling and includes fields for first name, middle name, last name, suffix, email, phone number, birthdate, gender (with radio buttons for male, female, prefer not to say), street address, barangay, country, city, region, and postal code. It also contains a submit button to submit the completed form.

Uploaded by

patricia gunio
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
42 views2 pages

Registration

The document contains an HTML registration form with various input fields for a user to enter personal information like name, email, phone number, birthdate, gender, and address. The form uses CSS for styling and includes fields for first name, middle name, last name, suffix, email, phone number, birthdate, gender (with radio buttons for male, female, prefer not to say), street address, barangay, country, city, region, and postal code. It also contains a submit button to submit the completed form.

Uploaded by

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

<!

DOCTYPE html>

<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Registration Form in HTML CSS</title>
<!---Custom CSS File--->
<link rel="stylesheet" href="style.css" />
</head>
<body>
<section class="container">
<header>Registration Form</header>
<form action="#" class="form">
<div class="input-box">
<label>First Name</label>
<input type="text" placeholder="Enter first name" required />
</div>

<div class="input-box">
<label>Middle Name</label>
<input type="text" placeholder="Enter middle name" required />
</div>

<div class="input-box">
<label>Last Name</label>
<input type="text" placeholder="Enter last name" required />
</div>

<div class="input-box">
<label>Suffix</label>
<input type="text" placeholder="Enter suffix" required />
</div>

<div class="input-box">
<label>Email Address</label>
<input type="text" placeholder="Enter email address" required />
</div>

<div class="column">
<div class="input-box">
<label>Phone Number</label>
<input type="number" placeholder="Enter phone number" required />
</div>
<div class="input-box">
<label>Birth Date</label>
<input type="date" placeholder="Enter birth date" required />
</div>
</div>
<div class="gender-box">
<h3>Gender</h3>
<div class="gender-option">
<div class="gender">
<input type="radio" id="check-male" name="gender" checked />
<label for="check-male">male</label>
</div>
<div class="gender">
<input type="radio" id="check-female" name="gender" />
<label for="check-female">Female</label>
</div>
<div class="gender">
<input type="radio" id="check-other" name="gender" />
<label for="check-other">prefer not to say</label>
</div>
</div>
</div>
<div class="input-box address">
<label>Address</label>
<input type="text" placeholder="Enter street address" required />
<input type="text" placeholder="Enter barangay address" required />
<div class="column">

<div class="input-box">
<label>Country</label>
<input type="text" placeholder="Enter country" required />
</div>

</div>
<input type="text" placeholder="Enter your city" required />
</div>
<div class="column">
<input type="text" placeholder="Enter your region" required />
<input type="number" placeholder="Enter postal code" required />
</div>
</div>
<button>Submit</button>
</form>
</section>
</body>
</html>

You might also like