Input attributes in HTML5

In this tutorial input attributes are briefly described.Here will be source codes with examples.

Some input attributes are given here.

value attribute

Name:  <input type="text" value="Imran">
Button:  <input type="button" value="click here">
This input attribute return the value which is set in value attribute initially.

output of above example

Name:  

Button:  

readonly and disabled attributes

Name:  <input type="text" value="Imran" readonly>
Name:  <input type="text" value="Imran" disabled>
Syntax to make the file disabled.

output of above example

readonly:  

disabled:  

Explanation readonly and disabled.

As in above example two attributes readonly and disabled are give, they can be used in any form. These attributes are used to prevent the user from selection.If you want to changed the disabled form's functionalities then its is only possible by script.While readonly attribute is used to prevent the users from changing the values in the input field in the given form.

size attribute

fname: <input type="text" size="10">
lname: <input type="text" value="click here" size="20">
size attribute used to give a with to input field which will be shown in the browser.

output of above example

fname:
input field with size 10.

lname:  
input field with size 20.

placeholder attribute

fname: <input type="text" placeholder="name">
password: <input type="password" placeholder="password" ">
placeholder is value which is shown in the input field which is used as a hint for the user to fill it.

output of above example

fname:
input field with placeholder

password:  
input field with password

required attribute

name: <input type="text" placeholder="name" required>
password: <input type="password" placeholder="password" required>
required attribute is just like a condition or validation to the form to prevent users from submitting the form having any one field empty.

output of above example

name:  

pass:   

There are many other form input attributes like:

maxlength attribute

 This is used for specify the maximum length of the input field.

min and max attribute

 This is used for specify the minimum and maximum value in the input field.

multiple attribute

 This is used for more than one value in the input field.

autofocus attribute

 This is used for to get automatic focus when the input field is in use.

height and width Attributes attribute

 This is used for to specify the height and with of the the input fields.









The Best

Comment here

If you have any query, if you want to know something about any of technical course related to computer science field, if you have any suggestion about relevant to uploaded content or if you anything wrong here (any mistake in content) than please contact us. Keep in mind, comment should be according to community guidelines.


ads