Scribd
Upload
10 views2 pages

HTML Practical 1

The document outlines practical tasks for creating various HTML forms, including basic form creation, dropdowns, radio buttons, checkboxes, and file uploads. Each task specifies required fields, validation rules, and expected outputs for functionality. Additionally, there is a bonus task focused on form layout and styling using CSS.

Uploaded by

joelmuya20
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
10 views2 pages

HTML Practical 1

The document outlines practical tasks for creating various HTML forms, including basic form creation, dropdowns, radio buttons, checkboxes, and file uploads. Each task specifies required fields, validation rules, and expected outputs for functionality. Additionally, there is a bonus task focused on form layout and styling using CSS.

Uploaded by

joelmuya20
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/ 2

Practical 1.

1. Basic Form Creation


Q1. Create an HTML form with the following fields:
 Name (text input, required)
 Email (email input, required)
 Password (password input, required, min-length 8)
 Submit button
Expected Output: The form should prevent submission if required fields are empty or the password is
too short.

2. Dropdown, Radio, and Checkbox Inputs


Q2. Design a form for booking a hotel room. It should include:
 A dropdown menu to select room type (Single, Double, Suite)
 Radio buttons to select meal preference (Vegetarian, Non-Vegetarian)
 A checkbox for Wi-Fi access
 A submit button
Expected Output: The form should allow users to choose one room type, one meal option, and
whether they want Wi-Fi.

3. Form Validation
Q3. Create a login form with:
 Username (text input)
 Password (password input, min-length 6)
 Remember Me (checkbox)
 Submit button
 Ensure validation for empty fields using HTML attributes.
Expected Output: The form should not submit if fields are empty or the password is too short.

4. Date and Number Inputs


Q4. Build a form for an event registration system with:
 Full Name
 Email
 Event Date (date input)
 Number of Tickets (number input, min 1, max 10)
 Submit button
Expected Output: The form should only allow valid dates and ticket quantities.

5. File Upload Form


Q5. Create a form that allows users to upload a profile picture. The form should include:
 Name
 Email
 File Upload (accept only image files: .jpg, .png, .jpeg)
 Submit button
Expected Output: The form should only allow image uploads.

6. Form Layout and Styling (Bonus Task)


Q6. Create a contact form with:
 Name
 Email
 Message (textarea)
 Submit button
 Add simple CSS styles to center the form and make it look visually appealing.
Expected Output: The form should be well-styled and user-friendly.

You might also like