# read-only pseudo-class

The `read-only` pseudo-class specifies the style of inputs with the `readonly` attribute. This input is read-only, i.e. it is impossible to enter or change data in it, but you can select and copy it.

## Syntax

`selector:read-only { }`

## Example

Let's give the read-only input a pale gray border:

`<p> <label>Enter text</label> <input type="text"> </p> <p> <label>Read text</label> <input type="text" value="text" readonly> </p>` `input:read-only { border: 1px solid #D8DFE8; }`

:

## See also

- the `:read-write` pseudo-class
  that sets a style of the inputs available for change
- the `:default` pseudo-class
  that sets a default style for elements
- the `:indeterminate` pseudo-class
  that styles switches that are in an indeterminate state
- the `:optional` pseudo-class
  that sets a style for the input that does not have a required attribute
- the `:placeholder-shown` pseudo-class
  that sets a style for elements when displaying tooltip text
- the `:required` pseudo-class
  that sets a style of the input that has the required attribute set
- the `:focus-within` pseudo-class
  that styles the elements in focus
- the `caret-color` property
  that sets a color of the text cursor in input

← →
↑
en ru