La pseudo-clase :read-write de CSS representa un elemento (como un input) que es editable por el usuario.

/* Selecciona cualquier elemento <input> que sea editable */
/* Compatible con Firefox con un prefijo */
input:-moz-read-write {
  background-color: #bbf;
}

/* Compatible con Blink/WebKit/Edge sin un prefijo */
input:read-write {
  background-color: #bbf;
}

Nota: Este selector no solo selecciona texto de <input>; seleccionará cualquier elemento que pueda editar el usuario, como un elemento <p> con contenteditable establecido en él.

Sintaxis

:read-write

Ejemplo

HTML

<input type="text" value="Escribe lo que quieras aquí.">
<input type="text" value="Este es un campo de solo lectura." readonly>
<p>Este es un párrafo normal.</p>
<p contenteditable="true">¡Puedes editar este párrafo!</p>

CSS

input { min-width: 25em; }
input:-moz-read-write { background: cyan; }
input:read-write { background: cyan; }

p:-moz-read-write { background: lightgray; }
p:read-write { background: lightgray; }
p[contenteditable="true"] { color: blue; }

Resultado

Especificaciones

Especificación Estado Comentarios
HTML Living Standard
La definición de ':read-write' en esta especificación.
Living Standard Ningún cambio.
HTML5
La definición de ':read-write' en esta especificación.
Recommendation Define la semántica con respecto a HTML y validación de restricciones.
Selectors Level 4
La definición de ':read-write' en esta especificación.
Working Draft Define la pseudo-clase, pero no la semántica asociada.

Compatibilidad con navegadores

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidEdge MobileFirefox for AndroidOpera for AndroidiOS SafariSamsung Internet
Soporte básicoChrome Soporte completo SiEdge Soporte completo SiFirefox Soporte completo Si
Prefijado Notas
Soporte completo Si
Prefijado Notas
Prefijado Requiere de un prefijo de vendedor : -moz-
Notas See bug 312971 for unprefixed status.
IE Sin soporte NoOpera Soporte completo SiSafari Soporte completo SiWebView Android ? Chrome Android Soporte completo SiEdge Mobile Soporte completo SiFirefox Android Soporte completo Si
Prefijado Notas
Soporte completo Si
Prefijado Notas
Prefijado Requiere de un prefijo de vendedor : -moz-
Notas See bug 312971 for unprefixed status.
Opera Android ? Safari iOS ? Samsung Internet Android Soporte completo Si
Matches editable elements that are neither <input> elements nor <textarea> elementsChrome Sin soporte NoEdge Sin soporte NoFirefox Soporte completo SiIE Sin soporte NoOpera Sin soporte NoSafari Sin soporte NoWebView Android Sin soporte NoChrome Android Sin soporte NoEdge Mobile Sin soporte NoFirefox Android Soporte completo SiOpera Android Sin soporte NoSafari iOS Sin soporte NoSamsung Internet Android Sin soporte No

Leyenda

Soporte completo  
Soporte completo
Sin soporte  
Sin soporte
Compatibility unknown  
Compatibility unknown
Ver notas de implementación.
Ver notas de implementación.
Requiere de un prefijo de proveedor o un de nombre diferente para su uso.
Requiere de un prefijo de proveedor o un de nombre diferente para su uso.

Ver también

Etiquetas y colaboradores del documento

Colaboradores en esta página: lajaso
Última actualización por: lajaso,