In this section, we will learn what the readonly attribute is and how to use it.

What is readonly Attribute in HTML <input> Tag?

The readonly attribute is used in an <input> element to turn that into a read only type of element.

When this attribute is applied to an <input> element, the element is still on the page and you can see it but you can’t add a value to it anymore. However, if there’s a default value in that input element, you can select and copy the value if you want. Also, with the Tab key on your keyboard, you can still select that input element.

HTML readonly Attribute in <input> Tag Syntax:

<input type = “type” readonly>

<input> Tag readonly Attribute Values

The readonly attribute is a Boolean attribute and that means we don’t need to set a value for this attribute. Simply use it in the target <input> element, and it becomes readonly.

Example: using readonly attribute in HTML <input> tag

See the Pen using readonly attribute in HTML <input> tag by Omid Dehghan (@odehghan) on CodePen.