Languages
[Edit]
EN

HTML - readonly input

3 points
Created by:
Elias999
489

In this article, we would like to show you how to create readonly input element in HTML.

Quick solution:

// ONLINE-RUNNER:browser;

<input value="Example text..." readonly />

or

// ONLINE-RUNNER:browser;

<input value="Example text..." readonly="readonly" />

 

Practical example

In this example, we use the input element's readonly attribute to create read-only input or textarea that can't be changed by the user (however it can be highlighted to copy the text).

// ONLINE-RUNNER:browser;

<!doctype html>
<html>
<body>
  <div>Text:</div>
  <input type="text" value="Example text..." readonly />

  <div>Date:</div>
  <input type="date" value="2021-01-01" readonly />

  <div>Email:</div>
  <input type="email" value="example.user@email.com" readonly />

  <div>Password:</div>
  <input type="password" value="some_password_here" readonly />

  <div>Multiline-text:</div>
  <textarea readonly>Example text...</textarea>
</body>
</html>

References

Native Advertising
🚀
Get your tech brand or product in front of software developers.
For more information Contact us
Dirask - we help you to
solve coding problems.
Ask question.

❤️💻 🙂

Join