HTML5 - Attributes




HTML5 Attributes

HTML5 adds a number of new attributes and we have already seen many of them while discussing the new input types. We will see a few more attributes in this section. These attributes make the elements more useful.

Autocomplete

The autocomplete attribute can be used to on or off the autocomplete feature of form input elements and <form> element. If autocomplete is on, browser automatically completes values based on the previous entries.

This attribute works with <form> as well as with input types text, email, url, tel, password, text, range, date and color. By making autocomplete on for the <form>, all the input fields will have autocomplete on. Even the autocomplete is on for <form>, you can make it off for any of the input fields if you want.

Example

<!DOCTYPE html>
 <html>
  <head>
    <title>HTML5 Autocomplete Attribute Example</title>
  </head>
  <body>
   <form action="#" autocomplete="on">
     First name:<input type="text" name="fname">
     Last name: <input type="text" name="lname">
     Password: <input type="password" name="password" autocomplete="off">
     E-mail: <input type="email" name="email">
     <input type="submit">
   </form>
  </body>
</html>

Result

HTML5 Autocomplete Attribute Example
First name:
Last name:
Password:
E-mail:

Autofocus

The autofocus attribute can be used to focus to an element when the page loads. It is a boolean attribute, that is you do not have to set any value to this attribute.

Example

<!DOCTYPE html>
<html>
 <head>
  <title>HTML5 Autofocus Attribute Example</title>
 </head>
 <body>
  <form action="#">
    First name:<input type="text" name="fname" autofocus>
    Last name: <input type="text" name="lname">
    <input type="submit">
  </form>
 </body>
</html>

Novalidate

The novalidate attribute can be used with <form> element if you do not want the form data to be validated when submitted.

Form

The form attribute can be used to associate any orphaned form control with any

on the page. You can specify one or more forms an input element belongs to. You just have to specify the form ids separated using whitespace.

HTML5 Attributes Another

Size Attribute, disabled Attribute, formaction, formenctype, formmethod, formnovalidate, formtarget, placeholder, min and max, height and width, list, required, step