Selector CSS : checked
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ódigo de ejemplo
Compatibilidad
Esta propiedad es soportada por todos los navegadores compatibles con CSS.
| 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 |
Ejemplo modificado por última vez : 30/12/2020