Deseamos compartir contigo la mejor solución que descubrimos en internet. Nosotros queremos que te sirva de ayuda y si deseas comentarnos cualquier detalle que nos pueda ayudar a crecer hazlo con libertad.
Él :read-only
CSSpseudo-clase representa un elemento (como input
o textarea
) que no es editable por el usuario.
input:read-only, textarea:read-onlybackground-color: #ccc;p:read-onlybackground-color: #ccc;
Sintaxis
:read-only
Ejemplos
Confirmación de la información del formulario en los controles de solo lectura/lectura y escritura
un uso de readonly
controles de formulario es permitir que el usuario verifique y verifique la información que puede haber ingresado en un formulario anterior (por ejemplo, detalles de envío), al mismo tiempo que puede enviar la información junto con el resto del formulario. Hacemos precisamente esto en el siguiente ejemplo.
Él :read-only
pseudo-clase se usa para eliminar todo el estilo que hace que las entradas parezcan campos en los que se puede hacer clic, haciéndolos parecer más como párrafos de solo lectura. :read-write
la pseudoclase, por otro lado, se usa para proporcionar un estilo más agradable al editable .
input:-moz-read-only, textarea:-moz-read-only, input:read-only, textarea:read-onlyborder: 0;box-shadow: none;background-color: white;textarea:-moz-read-write, textarea:read-writebox-shadow: inset 1px 1px 3px #ccc;border-radius: 5px;
Puede encontrar el código fuente completo en readonly-confirmation.html; esto se traduce así:
Dar estilo a los controles sin formato de solo lectura
Este selector no solo selecciona /
elementos: seleccionará ninguna elemento que no puede ser editado por el usuario.
<pcontenteditable>This paragraph is editable; it is read-write.p><p>This paragraph is not editable; it is read-only.p>
pfont-size: 150%;padding: 5px;border-radius: 5px;p:read-onlybackground-color: red;color: white;p:read-writebackground-color: lime;
Especificaciones
Especificación | Estado | Comentario |
---|---|---|
Estándar de vida HTML La definición de ‘: solo lectura’ en esa especificación. |
Estándar de vida | Ningún cambio. |
HTML5 La definición de ‘: solo lectura’ en esa especificación. |
Recomendación | Define la semántica con respecto a HTML y la validación de restricciones. |
Selectores Nivel 4 La definición de ‘: solo lectura’ en esa especificación. |
Borrador de Trabajo | Define la pseudoclase, pero no la semántica asociada. |
Compatibilidad del navegador
Escritorio | Móvil | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Cromo | Borde | Firefox | explorador de Internet | Ópera | Safari | WebView Android | cromo androide | Firefox para Android | Ópera Android | Safari en IOS | Samsung Internet | |
:read-only |
1 | 13 | 781.5 | No | 9 | 4 | ≤37 | 18 | 4 | 10.1 | 3.2 | 1.0 |
Ver también
:read-write
- HTML
contenteditable
attribute
Recuerda que puedes dar recomendación a este artículo si te fue de ayuda.