Label de checkbox personalizada

label {
 border:1px solid #ccc;
 padding:10px;
 margin:0 0 10px;
 display:block; 
}

label:hover {
 background:#eee;
 cursor:pointer;
}

input[type=checkbox] + label {
    color: black;
}
input[type=checkbox]:checked + label {
    background: #efefef;
}

Si queremos que solo afecte a un form determinado añadimos la clase y lo metemos todo de un div

.miEStilo label {
 border:1px solid #ccc;
 padding:10px;
 margin:0 0 10px;
 display:block; 
}

.miEstilo label:hover {
 background:#eee;
 cursor:pointer;
}
<div class= "miEStilo">contenido</div>

Link interesante para revisar

https://toolset.com/forums/topic/css-styling-of-checkboxes-in-views-parametric-search/

https://www.w3schools.com/bootstrap4/bootstrap_forms_custom.asp

Deja un comentario

Tu dirección de correo electrónico no será publicada.

Ir arriba

We are using cookies on our website

Please confirm, if you accept our tracking cookies. You can also decline the tracking, so you can continue to visit our website without any data sent to third party services.