HTML
<label class="container"> <input type="checkbox" checked="checked">One</label><br> <label class="container"> <input type="checkbox">Two</label><br> <label class="container"> <input type="checkbox">Three</label><br> <label class="container"> <input type="checkbox">Four</label> <style> .container { cursor: pointer; font-size: 22px; } </style>
<label class="container"> <input type="checkbox" checked="checked">One</label> <label class="container"> <input type="checkbox" >Two</label> <label class="container"> <input type="checkbox" >Three</label> <label class="container"> <input type="checkbox" >Four</label> <style> .container { cursor: pointer; padding-left: 30px; font-size: 22px; } </style>
<style> input[type="checkbox"]:checked ~ span{ color: red;} label {cursor:pointer;padding-left: 20px; font-size: 22px;} </style> <label> <input type="checkbox" > <span>One</span></label> <label> <input type="checkbox" > <span>Two</span></label> <label> <input type="checkbox" > <span>Three</span></label> <label> <input type="checkbox" > <span>Four</span></label>