¿Cómo dar estilo a checkboxes y radiobuttons con CSS3?

1 estrella2 estrellas3 estrellas4 estrellas5 estrellas (Ninguna valoración todavía)
Cargando…

También te podría gustar...

Sobre este artículo

1 estrella2 estrellas3 estrellas4 estrellas5 estrellas (Ninguna valoración todavía)
Cargando…

Licencia: Contenido exclusivo de LaWebera.es. Prohibida su copia.

URL: LaWebera.es :: Diseño de paginas web

Lleva trabajando como desarrollador web desde hace más de 10 años. Es un apasionado del código, habiendo tocado todos los palos, especialmente PHP, MySQL, JavaScript, incluyendo frameworks y librerías como jQuery, Symfony, CakePHP…

8 Respuestas

  1. Gerson

    Gracias, y si quisiera mantener los dos estilos de checkbox (el default y el nuevo)

  2. Salomé A

    Muy bueno! una consulta… Lo hice y funcionó super bien con los estilos dentro de la cabecera del html, pero cuando lo adjunto en una hoja de estilos todo desaparece. ¿Sabes que puede estar pasando?

  3. melina

    no funciona cuando lo uso para los radio :/

  4. Daniel Ernesto Navarro Herrera

    Tyler simplemente pones la etiqueta label antes del checkbox en el código HTML.

  5. tyler

    y como hago si quiero que el label salga antes del checkbox (o sea, que este a la izquierda del checkbox)?

  6. Óscar

    Gracias por la información, me ha servido para controlar los estilos del checkbox, pero… he comprobado que los estilos no se aplican en los navegadores de smartphones… Estoy peleando con este tema porqué los checkbox salen muy pequeños y dificultan la usabilidad.
    ¿Cónoces alguna solución? muchas gracias por adelantado.

    • Daniel Ernesto Navarro Herrera

      Desgraciadamente funcionalidades como los selectores por atributo o :checked no funcionan en ciertas versions de iOS, puedes optar por aumentar el tamaño y utilizar imágenes para darle estilo a los checkboxes cuando el dispositivo del usuario tenga una pantalla con una resolución pequeña, esto se logra utilizando media queries de CSS.

Deja un comentario

El email no se publica. Todos los campos obligatorios.