Style <input> elements with a "readonly" attribute with CSS



To select elements that are read-only, use the CSS :read-only selector.

Example

You can try to run the following code to implement the :read-only selector

Live Demo

<!DOCTYPE html> <html>    <head>       <style>          input:read-only {             background-color: blue;             color: white;          }       </style>    </head>    <body>       <form>          Subject: <input type = "text" name = "subject" value = "Maths"><br>          Student: <input type = "text" name = "student" readonly value = "Amit"><br>       </form>    </body> </html>
Updated on: 2020-07-01T09:15:24+05:30

2K+ Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements