NovaMonoFix
Errores PHP
X
Usuario
Password
0 FPS

Selector CSS : :checked

30 de Diciembre del 2020 por Josep Antoni Bover. 0 visitas, 0 comentarios, 0 votos
Categorías : CSS.
La web está en segundo plano, animación en pausa.
Cargando animación...

Este selector apunta a los controles input[type=radio], o input[type=checkbox] marcados.


Sintaxis

:checked { };

¿Sabías que...?

Se puede utilizar el selector checked para definir atributos de uno o mas objetos adyacentes. Por ejemplo podemos ocultar el input[radio/checkbox] y dejar un label personalizado en su lugar y asociar dicho label al input. Una vez asociados, los clicks que se hacen en el label, repercutiran en el estado del input ocultado. Mira este ejemplo : CheckBox-basico

Incluso se puede complicar mas la cosa y crear controles para todo tipo de situaciones, solo hace falta echarle imaginación. En el siguiente ejemplo utiliza un grupo de contrones input[radio] personalizados, que al presionarlos muestran una tarjeta con información : RadioBox-avanzado


Códigos de ejemplo



Compatibilidad

Esta propiedad es soportada por todos los navegadores compatibles con CSS3.

Soportado a partir de la versión 1
Soportado a partir de la versión 1
Soportado a partir de la versión 9
Soportado a partir de la versión 3.1
Soportado a partir de la versión 9

Documento modificado por última vez : 30/12/2020
Ejemplo modificado por última vez : 30/12/2020

Enlaces relacionados