Selector pseudo-element :read-only

input:read-only
Selects input elements with the “readonly”
attribute specified

In fact, :read-only matches anything that :read-write doesn’t match, making it equivalent to :not(:read-write).

Exsmples

input:read-only,
textarea:read-only {
  border: 0;
  box-shadow: none;
  background-color: #dddddd;
}

textarea:read-write {
  outline: 1px dashed red;
  outline-offset: 2px;
  border-radius: 5px;
}

p {
  font-size: 150%;
  padding: 5px;
  border-radius: 5px;
}

p:read-only {
  background-color: red;
  color: white;
}

p:read-write {
  background-color: lime;
}