Scribd Logo
Upload

Welcome to Scribd!

  • Creating Form

    Uploaded by

    Claire Asagra
    6 views20 pages
    The document describes different input types for HTML forms, including text, checkbox, radio button, file upload, submit, reset, image, hidden, and password. It also covers other form elements like select dropdowns, textareas, and buttons. New HTML5 form elements discussed are datalist, keygen, and output. Input types allow creating different form fields to collect user data, with each type serving a specific purpose like text entry, selections, uploads, or form submission.

    Original Description:

    Original Title

    CREATING FORM

    Copyright

    © © All Rights Reserved

    Available Formats

    PPTX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    The document describes different input types for HTML forms, including text, checkbox, radio button, file upload, submit, reset, image, hidden, and password. It also covers other form elements like select dropdowns, textareas, and buttons. New HTML5 form elements discussed are datalist, keygen, and output. Input types allow creating different form fields to collect user data, with each type serving a specific purpose like text entry, selections, uploads, or form submission.

    Copyright:

    © All Rights Reserved
    Download as PPTX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    6 views20 pages

    Creating Form

    Uploaded by

    Claire Asagra
    The document describes different input types for HTML forms, including text, checkbox, radio button, file upload, submit, reset, image, hidden, and password. It also covers other form elements like select dropdowns, textareas, and buttons. New HTML5 form elements discussed are datalist, keygen, and output. Input types allow creating different form fields to collect user data, with each type serving a specific purpose like text entry, selections, uploads, or form submission.

    Copyright:

    © All Rights Reserved
    Download as PPTX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 20

    CREATING

    FORM
    DIFFERENT INPUT TYPES
    <input> tags allow you to create an input field where user can
    enter data. <input> tag can be found inside <body> tag and
    usually within <form> tag. It is a single tag. There are different
    INPUT types available:

    HTML4 INPUT TAG


    1. Button
    <input type="button"> denotes a clickable
    button.

    Example:
    Output:
    2. Checkbox
    <input type="checkbox"> denotes a checkbox.
    Example:

    Output:
    3. File
    <input type="file"> denotes a file-select field
    and a "Browse..." button for file uploads.
    Example:

    Output:
    4. Hidden
    <input type="hidden"> denotes a hidden input field.
    5. Image
    <input type="image"> denotes an image as the submit button.
    Example:

    Output:
    6. Password
    <input type="password"> denotes a password field as characters are
    masked.
    Example:

    Output:
    7. Radio
    <input type="radio"> denotes a radio button.
    Example:

    Output:
    8. Reset
    <input type="reset"> denotes a reset button.
    This when clicked resets all form values to
    default values.
    9. Submit
    <input type="submit"> denotes a submit
    button.
    10. Text
    <input type="text"> denotes a single-line text
    field. When developers do not specify the type
    of INPUT this is the default input type. The
    default width is up to 20 characters)
    Example:
    Output:
    There are different form elements available in HTML aside from INPUT.
    Here are the following form elements:
    1. <select> element
    This form element defines a drop-down list. This element works together
    with <option> element which defines the options to select.
    Example:
    Note: Normally the list show the first item as selected. However, if
    you want to specify the selected item/option, use
    the selected attribute just like in the given example above.
    2. <textarea> element
    This form element is used if you want to define
    a multiple line input field.
    Example:
    Note: The attributes rows and cols specifies the size of a text
    area. colsspecifies the visible width of a text area while
    the rows defines the height. Other useful attributes
    are: maxlength (HTML5) which limits the number of characters
    allowed in the text area; placeholder (HTML5) specifies a clue or hint
    that describes the expected value of a text area; required(HTML5)
    specifies that a text area must be filled out.
    3. <button> element
    This form element defines a clickable button.
    (same as <input type="button">).
    Example
    The following are new form elements in HTML5.
    4. <datalist> element
    This form element specifies a list of pre-defined options for an <input>
    element. When user input data, they will see a list of pre-defined options.
    5. <keygen> element
    6. <output> element
    THANK YOU

    You might also like