Input Tags<br />Bastian, Jehazel Faye O.<br />Pawid, KalehlaNikole<br />Compelio, Keren Joy T.<br />
What is an input tag?<br />The HTML input tag is used to display control elements that allow users to input data in a form...
Types<br />
1. Text<br /><ul><li><input type="text">
Most common input type
It defines a control designed for text input.
It lets the readers type in any text information into the box (e.g., names, titles, etc.). </li></li></ul><li>2. Password<...
It hides the characters inputted using dots or asterisks
When you type in it, the letters are hidden. </li></li></ul><li>3. Checkbox<br /><ul><li><input type="checkbox" />
One can give a list of items to choose from. They can choose more than one in the list. Or it can be used as a "yes/no" to...
Each checkbox works as an on/off switch (boolean values). This control is commonly used in forms to select options, intere...
Only one of those radio buttons can be checked, and when it's checked, the rest are automatically unchecked.
Radio button groupings all have the same name attribute, and each value is different. If a reader chooses one value, all t...
 It creates a button. When a submit button is pressed it automatically submits the form.
This field sends the form information to the web server when it is clicked. </li></li></ul><li>6.Image<br /><ul><li><input...
Upcoming SlideShare
Loading in …5
×

Input tags (report)

593 views

Published on

Input Tags for HTML

Published in: Education, Technology, Design
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
593
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
6
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Input tags (report)

  1. 1. Input Tags<br />Bastian, Jehazel Faye O.<br />Pawid, KalehlaNikole<br />Compelio, Keren Joy T.<br />
  2. 2. What is an input tag?<br />The HTML input tag is used to display control elements that allow users to input data in a form. The conduct of the control depend mostly on the "type" attribute. This attribute defines the kind of control to be shown.<br />
  3. 3. Types<br />
  4. 4. 1. Text<br /><ul><li><input type="text">
  5. 5. Most common input type
  6. 6. It defines a control designed for text input.
  7. 7. It lets the readers type in any text information into the box (e.g., names, titles, etc.). </li></li></ul><li>2. Password<br /><ul><li><input type="password" />
  8. 8. It hides the characters inputted using dots or asterisks
  9. 9. When you type in it, the letters are hidden. </li></li></ul><li>3. Checkbox<br /><ul><li><input type="checkbox" />
  10. 10. One can give a list of items to choose from. They can choose more than one in the list. Or it can be used as a "yes/no" toggle, when there is only one option.
  11. 11. Each checkbox works as an on/off switch (boolean values). This control is commonly used in forms to select options, interests, etc. Several checkboxes can share the same control name, allowing authors to set more than one value for a single property.</li></li></ul><li>4. Radio<br /><ul><li><input type="radio" />
  12. 12. Only one of those radio buttons can be checked, and when it's checked, the rest are automatically unchecked.
  13. 13. Radio button groupings all have the same name attribute, and each value is different. If a reader chooses one value, all the other values will be deselected.</li></li></ul><li>5. Submit<br /><ul><li><input type="submit">
  14. 14. It creates a button. When a submit button is pressed it automatically submits the form.
  15. 15. This field sends the form information to the web server when it is clicked. </li></li></ul><li>6.Image<br /><ul><li><input type="image" src= "ABCbuttn.gif" width="88" height="31" alt="About.com - image courtesy About.com" border="0" />
  16. 16. This creates a submit button that can take a graphical aspect.
  17. 17. The image shown here happens to look like a button, but you can use any image as a button on your forms. </li></li></ul><li>7. Reset<br /><ul><li><input type="reset">
  18. 18. This type creates a button. When a "reset" button is clicked, all the form's fields are reset to their respective initial values.</li></li></ul><li>8. Button<br /><ul><li><input type="button" value="button" name="button" />
  19. 19. The button type creates an ordinary button with no default action associated to it. Actions for this buttons are usually defined with client side scripts (e.g., JavaScript).</li></li></ul><li>9. Hidden<br /><ul><li><input type="hidden" />
  20. 20. It is used to "save state" within an HTML form.
  21. 21. They are most often used in forms that have multiple pages and information that needs to be carried from one page to the next.
  22. 22. They are not shown on the Web page, but the information is sent along with other form input fields.</li></li></ul><li>10. File<br /><ul><li><input type="file" />
  23. 23. This control type allows users to select a file to upload. The file is uploaded when the form is submitted.
  24. 24. the form's attribute "enctype" must take the value "multipart/form-data".</li></li></ul><li>

×