#foo:checked::before, input(type="checkbox") ( position:absolute; clip: rect(0,0,0,0); clip: rect(0 0 0 0); ) #foo:checked, input(type="checkbox") + label::before ( content: url('checkbox.png.webp'); ) input(type="checkbox"):checked + label::before ( content: url('checkbox-checked.png.webp'); )
#foo verwijst niet naar een bepaald element, het is er puur om te voorkomen dat browsers de latere selectors implementeren als het dat niet begrijpt (aangezien de meeste browsers de hele selector laten vallen als een deel ervan faalt).