1 / 13

Learn Advanced and Basic HTML - Lesson 4 (i)

With HTML you can create your own Website. This tutorial teaches you everything about HTML. For full HTML course visit our website www.training-n-development.com

Download Presentation

Learn Advanced and Basic HTML - Lesson 4 (i)

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. Learn HTML BasicsLesson No : 04 (First Part) Publisher : Attitude Academy

  2. HTML Forms The <form> Element HTML forms are used to collect user input.The <form> element defines an HTML form: <form>form elements</form> HTML forms contain form elements. Form elements are different types of input elements, checkboxes, radio buttons, submit buttons, and more. The <form> Element Action and method is Form Attribute

  3. The Action Attribute The action attribute defines the action to be performed when the form is submitted. The common way to submit a form to a server, is by using a submit button. Normally, the form is submitted to a web page on a web server. In the example above, a server-side script is specified to handle the submitted form: <form action="action_page.php"> The Method Attribute The method attribute specifies the HTTP method (GET or POST) to be used when submitting the forms: <form  method="get“> Or <form  method="post">

  4. HTML Form Elements

  5. The <textarea> Element The <textarea> element defines a multi-line input field (a text area): <body> <form action="action_page.php"> <textarea name="message" rows="10" cols="30">The cat was playing in the garden.</textarea> <input type="submit"> </form> </body>

  6. Grouping Form Data with <fieldset> The <fieldset> element groups related data in a form. The <legend> element defines a caption for the <fieldset> element. Example: <form> <fieldset> <legend>Personal information:</legend> First name: <input type="text" name="firstname" value="Mickey“> Last name <input type="text" name="lastname" value="Mouse“> <input type="submit" value="Submit"> </fieldset> </form>

  7. The <lagend> The <select> element defines a drop-down list: Example: <body> <form action="demo_form.asp">  <label for="male">Male</label>  <input type="radio" name="gender" id="male" value="male"><br>  <label for="female">Female</label>  <input type="radio" name="gender" id="female" value="female"><br>  <label for="other">Other</label>  <input type="radio" name="gender" id="other" value="other"><br><br>  <input type="submit" value="Submit"></form> </body>

  8. The <label> The <select> element defines a drop-down list: Example: <body> <form action="demo_form.asp">  <label for="male">Male</label>  <input type="radio" name="gender" id="male" value="male"><br>  <label for="female">Female</label>  <input type="radio" name="gender" id="female" value="female"><br>  <label for="other">Other</label>  <input type="radio" name="gender" id="other" value="other"><br><br>  <input type="submit" value="Submit"></form> </body>

  9. The <select> Element (Drop-Down List) The <select> element defines a drop-down list: Example: <body> <form action="action_page.php"> <select name="cars"> <option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="fiat">Fiat</option> <option value="audi">Audi</option> </select> <br><br> <input type="submit"> </form> </body>

  10. The <optiongroup> Element (Drop-Down List) The <optgroup> is used to group related options in a drop-down list. If you have a long list of options, groups of related options are easier to handle for a user. Example: <body> <form> <select> <optgroup label="Swedish Cars"> <option value="volvo">Volvo</option> <option value="saab">Saab</option> </optgroup> <optgroup label="German Cars"> <option value="mercedes">Mercedes</option> <option value="audi">Audi</option> </optgroup> </select> </form> </body>

  11. The <button> Element The <button> element defines a clickable button: <body> <button type="button" onclick="alert('Hello World!')">Click Me!</button> </body>

  12. PRACTICAL IMPLEMENTATION

  13. Visit Us : Attitude Academy

More Related