Exercise 12
- Create a new folder with the name
ex_12
- Create the following file structure
/ex_12
|-- img
| |-- register_button.png
|-- index.html
|-- create_user.html
index.html
- Add a Document Title: Create User
- Add a Main Title: Create User
- Add an Horizontal Rule
- Create a form element with the following attributes:
- action: create_user.html
- method: get
- enctype: 'application/x-www-form-urlencoded'
- Inside the form create the following inputs:
- Create a text input with the folloging attributes:
- name: username
- placeholder: username
- size: 30
- maxlength: 12
- Add a label for this input
- Add a fieldset and legend elements. Legend content: User Form
- Create a password input with the folloging attributes:
- name: password
- size: 30
- maxlength: 8
- placeholder: password
- Add a label for this input
- Create a radio button group with the following values:
- Description: Select your favourite superheroe
- Inputs values and description: Superman, Batman, Wonder Woman, Flash, Thor & Hulk
- Default selected superhero can be Batman or Wonder Woman becouse they rock! your call
- Inputs name should be superheros
- Add a label for this input
- Create a Checkbox group with the following values:
- Description: Select your favourite video game
- Inputs values and description: Fifa, NHL, Residen Evil & Uncharted
- Default selected video game can be Fifa & Uncharted
- Inputs name should be videogames
- Add a label for this input
- Create a hidden input with the following attributes:
- name: userid
- value: 2300
- Create a image button:
- name: login
- src: add the path to get te register_button.png image
- width and height: resize it to make the image look good
- Create a text input with the folloging attributes:
create_user.html
- Add a Document Title: Created User
- Add a Main Title: Created User
- Add an Horizontal Rule
- Add a parragraph with the following text: Now you can login to our site
- Create a fake link (href=#) around the login word from the previous paragraph
- Go to index.html
- Input all the form data
- Submit the form by clicking on the submit button
- The browser will navigate to the create_user.html page
- Take a look at the URL to see the data that you just input on the previous form