Pseudoclase read-only

La pseudoclase read-only define el estilo para inputs con el atributo readonly. Dicho input está destinado solo para lectura, es decir, es imposible introducir o modificar datos en él, pero estos se pueden seleccionar y copiar.

Sintaxis

cssselector:read-only {
  
}

Ejemplo

Establezcamos bordes gris pálido para un input destinado solo para lectura:

html<p>
  <label>Introducir texto</label>
  <input type="text">
</p>
<p>
  <label>Texto de solo lectura</label>
  <input type="text" value="texto" readonly>
</p>

cssinput:read-only {
  border: 1px solid #D8DFE8;
}

Результат:

Véase también

seudoclase :read-write,
que define el estilo para inputs disponibles para modificación
seudoclase :default,
que define el estilo para elementos por defecto
seudoclase :indeterminate,
que define el estilo para interruptores que se encuentran en estado indeterminado
seudoclase :optional,
que define el estilo para un input que no tiene el atributo required
seudoclase :placeholder-shown,
que define el estilo para elementos cuando se muestra el texto de sugerencia
seudoclase :required,
que define el estilo para un input que tiene el atributo required establecido
seudoclase :focus-within,
que define el estilo para elementos en foco
propiedad caret-color,
que define el color del cursor de texto en el input