Home

Checkbox.css

Checkbox.css es un conjunto de estilos útiles para estilizar los checkbox de manera sencilla.

Estructura HTML compatible con diferentes navegadores:

HTML

<ul class="list">
    <li class="list__item">
        <label class="custom-check">
            <input class="custom-check__checkbox check-A" type="checkbox" checked="true" name="check-A" />
            <span class="custom-check__checkbox check-A__background"></span>
            <span class="custom-check__checkbox check-A__checkbox"></span>
            <span class="custom-check__text">label</span>
        </label>
    </li>

    <li class="list__item">
        <label class="custom-check">
            <input class="custom-check__checkbox check-A" type="checkbox" name="check-A" />
            <span class="custom-check__checkbox check-A__background"></span>
            <span class="custom-check__checkbox check-A__checkbox"></span>
            <span class="custom-check__text">label</span>
        </label>
    </li>

    <li class="list__item">
        <label class="custom-check">
            <input class="custom-check__checkbox check-A" type="checkbox" name="check-A" />
            <span class="custom-check__checkbox check-A__background"></span>
            <span class="custom-check__checkbox check-A__checkbox"></span>
            <span class="custom-check__text">label</span>
        </label>
    </li>
</ul>