Teste se um navegador suporta um seletor de CSS

Realmente simples: como faço para testar com mais precisão se um navegador tem suporte para um determinado seletor de CSS?

Atualmente, tenho algum código CSS que torna a página um pouco mais interativa usando o método:checked seletor em CSS, mas quero criar um script de fallback que faça a mesma coisa com JavaScript, mas apenas se o navegador do usuário não tiver suporte para o:checked seletor.

Minha pergunta é: como faço para testar com mais precisão se o navegador do usuário suporta um determinado seletor de CSS?

Aqui está o código em que eu gostaria de usá-lo:

HTML:

<label class="coolbox">
    <input type="checkbox"/>
    <span>I want to eat some caek.</span>
</label>

CSS:

.coolbox input {display:none;}
.coolbox span::before {
    content: "";
    display:inline-block;
    width:10px;
    height:10px;
    margin-right:5px;
    border:1px solid black;
}
.coolbox:hover span::before {border:1px solid #555;}
.coolbox:active span::before {border:1px solid #999;}

.coolbox span::before {background-color:#F77;}
.coolbox input:checked + span::before {background-color:#4A4;}

Demo

PS: Prefiro não usar apenas comentários condicionais, porque gostaria de seguir o padrão de detecção de recursos em vez de navegadores.

questionAnswers(4)

yourAnswerToTheQuestion