Skip to main content

Exercise 11

  1. Create a new folder with the name ex_11
  2. Create the following file structure
    /ex_11
    |-- index.html
    |-- login.html

index.html

  1. Add a Document Title: Login
  2. Add a Main Title: Login
  3. Add an Horizontal Rule
  4. Create a form element with the following attributes:
    • action: login.html
    • method: get
    • enctype: 'application/x-www-form-urlencoded'
  5. Inside the form create the following inputs:
    • Create a text input with the following attributes: name: username placeholder: username size: 30 maxlength: 12
    • Create a password input with the following attributes:
      • name: password
      • size: 30
      • maxlength: 8
      • placeholder: password
    • Create a submit button:
      • value: Login
      • name: login

login.html

  1. Add a Document Title: Look at the URL

  2. Add a Main Title: Look at the URL

  3. Add an Horizontal Rule

  4. Add a paragraph with the following text: We created our first form!!

  5. Go to index.html

  6. Input a username and password

  7. Submit the form by clicking on the submit button

  8. The browser will navigate to the login.html page

  9. Take a look at the URL to see the data that you just input on the previous form

  10. Now change the form method to be post instead of get and go over the last steps to input data, execute the form and look at the URL again to see the difference between these two methods :)