Internet Technology

HTML forms A form can contain input elements like text fields, checkboxes, radio-buttons, submit buttons and more. A form can also contain select lists, textarea, fieldset, legend, and label elements.

Checkboxes <html> <body> <form action=""> <input type="checkbox" name="vehicle" value="apple"/> i like apple<br/> <input type="checkbox" name="vehicle" value="orange"/> i like orange </form> </body> </html> Create text fields <html> <body> <form action=""> first name:<input type="text" name="firstname"/><br/> last name:<input type="text" name="lastname"/> </form> <p><b>note:</b>the form itself is not visible.also note that the default width of a text field is 20 characters.</p> </body> </html> Simple drop-down list <html> <body> <form action=""> <select name="cars"> <option value="volvo">volovo</option> <option value="saab">saab</option> <option value="fiat">fiat</option> <option value="audi">audi</option> </select> </form> </body> </html>	Create a button <html> <body> <form action=""> <input type ="button"value="hello world"> </form> </body> </html> Draw a border around form-data <html> <body> <form action=""> <fieldset> <legend>personal information:</legend> name:<input type="text" size="30"/><br/> e mail:<input type="text" size="30"/><br/> date of birth:<input type="text" size="10"/><br/> </fieldset> </form> </body> </html> Textarea (a multi-line text input field) <html> <body> <textarea rows="10"cols="30"> yasitha thilantha </textarea> </body> </html>	Create password field <html> <body> <form action=""> username:<input type="text" name="user"/><br/> password:<input type="password" name="password"/> </form> <p><b>note:</b>the characters in apassword field are masked (shown as asterisks or circles.)</p> </body> </html> Radio buttons <html> <body> <form action=""> <input type="radio" name="sex"value="male"/>male<br/> <input type="radio"name="sex"value="female"/>female </form> <p><b>note:</b>when a user clicks on a radio-button ,it becomes checked,and all other radio-buttons with equal name become unchecked.</p> </body> </html>

Web Design

HTML forms