HTML Assignment – 3

Basic Questions

  1. Create a simple HTML form with a single text input field for entering a username.
  2. Build a form with a password input field that hides typed characters.
  3. Make a form that includes two text fields: First Name and Last Name.
  4. Add a submit button in a form that sends data when clicked.
  5. Create a form with a reset button that clears the inputs.
  6. Create a form with radio buttons for selecting gender (Male/Female).
  7. Make a form with checkboxes for selecting hobbies (e.g., Reading, Sports, Coding).
  8. Add a form with a file upload input to let users upload a profile picture.
  9. Use the <label> tag to correctly label a text input field.
  10. Create a dropdown menu using <select> with options for choosing a country.
  11. Build a form that includes a textarea for user comments.
  12. Create a form with a button element labelled “Click Me”.
  13. Add a required attribute in a text input field for entering a name.
  14. Build a form with type=”email” input and test validation.
  15. Create a form with a number input for entering age.
  16. Add a date picker input to select a birthdate.
  17. Create a form with a time input for selecting appointment time.
  18. Add a colour input where users can pick a favourite color.
  19. Create a range input for selecting volume level (1-100).
  20. Use <fieldset> and <legend> to group personal details inputs (name, email).

Intermediate Questions

  1. Create a login form with username and password fields, and a submit button.
  2. Create a contact form containing Name, Email, Phone, and Message fields.
  3. Add radio buttons for “Payment Method” (Credit Card, UPI, Cash on Delivery).
  4. Use checkboxes for selecting multiple languages (English, Hindi, French, Spanish).
  5. Create a form where the age input is restricted between 18-60 using min and max attributes.
  6. Build a form that has pattern validation for a 10-digit phone number.
  7. Create a file upload form where only PDF files are allowed using the accept attribute.
  8. Add a dropdown to select a user’s profession (Student, Teacher, Developer, Designer).
  9. Create a form that disables the submit button until terms & conditions are checked.
  10. Build a form using <fieldset> and <legend> for grouping address details.
  11. Create a form where email input must follow correct format (e.g., abc@mail.com).
  12. Add a placeholder attribute in inputs for guiding user entries.
  13. Create a form using password input with a “Confirm Password” field.
  14. Make a form with a reset button and test clearing inputs.
  15. Create a newsletter signup form with Name, Email, and a Subscribe button.
  16. Add a disabled input field in a form (show readonly behavior).
  17. Create a form with hidden input fields (like a user ID).
  18. Add a form where the range input shows values from 1 to 10 for rating experience.
  19. Design a colour picker form allowing users to set background colour.
  20. Build a form using tel input type for phone number formatting.

Advanced Questions

  1. Create a registration form with full validation (Name, Email, Password, Confirm Password, Gender, Country).
  2. Make a form where passwords must meet a pattern (8+ characters, at least 1 capital, 1 number).
  3. Create a multi-step form: Step 1 (Personal Info), Step 2 (Contact Info), Step 3 (Submit).
  4. Build a survey form with a mix of text, radio, checkbox, dropdown, and textarea inputs.
  5. Create a job application form with File Upload restricted to only PDFs or DOCs.
  6. Create a form that disables submit if required fields are empty.
  7. Add ARIA labels and roles for accessibility in a form with multiple input types.
  8. Create a form where the date input must be today or later (for booking purposes).
  9. Build a profile settings form with Name, Profile Picture Upload, Colour Theme Picker, and Save button.
  10. Create a feedback form that includes star rating (radio buttons), comment box, and submit.