Scribd
Upload
40 views6 pages

Rupak 5

The document describes an experiment to design a registration page with fields for name, password, email, phone number, gender, and date of birth. It includes the HTML and CSS code to create the registration form layout, with labels and input fields for each required registration detail. The form is submitted to a registration processing page upon click of the register button.

Uploaded by

Ritik Chauhan
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
40 views6 pages

Rupak 5

The document describes an experiment to design a registration page with fields for name, password, email, phone number, gender, and date of birth. It includes the HTML and CSS code to create the registration form layout, with labels and input fields for each required registration detail. The form is submitted to a registration processing page upon click of the register button.

Uploaded by

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

Experiment -05

Name: Rupak Kaushik


Roll No.: 2200271690043
Objective:
Design Registration Page with following details
a. REGISTRATION PAGE 1. Name 2. Password 3. E-mail 4.Phone Number 5.Gender 6. Date of
Birth

Code:

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Registration</title>

<style>

body {

font-family: Arial, sans-serif;

background-color: #f2f2f2;

margin: 0;

padding: 0;

header {

background-color: #333;

color: #fff;
text-align: center;

padding: 10px;

h1 {

margin: 0;

.container {

max-width: 800px;

margin: 20px auto;

padding: 20px;

background-color: #fff;

box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);

label {

display: block;

margin-top: 10px;

input, select {

width: 100%;
padding: 10px;

margin-top: 5px;

margin-bottom: 10px;

border: 1px solid #ccc;

border-radius: 4px;

.submit-button {

display: block;

width: 100%;

padding: 10px;

background-color: #333;

color: #fff;

text-align: center;

text-decoration: none;

font-weight: bold;

.submit-button:hover {

background-color: #555;

</style>

</head>
<body>

<header>

<h1>Registration</h1>

</header>

<div class="container">

<form action="registration_process.php" method="post">

<label for="name">Name:</label>

<input type="text" id="name" name="name" required>

<label for="password">Password:</label>

<input type="password" id="password" name="password" required>

<label for="email">E-mail:</label>

<input type="email" id="email" name="email" required>

<label for="phone">Phone Number:</label>

<input type="tel" id="phone" name="phone" required>

<label for="gender">Gender:</label>

<select id="gender" name="gender" required>

<option value="male">Male</option>

<option value="female">Female</option>

<option value="other">Other</option>
</select>

<label for="dob">Date of Birth:</label>

<input type="date" id="dob" name="dob" required>

<label for="language">Preferred Language:</label>

<input type="text" id="language" name="language" required>

<label for="address">Address:</label>

<textarea id="address" name="address" rows="4"


required></textarea>

<input type="submit" value="Register" class="submit-button">

</form>

</div>

</body>

</html>
Experiment- 05 ( Output)

You might also like