Eu tenho um arquivo CSS enorme e um arquivo HTML. Gostaria de descobrir quais regras não são usadas ao exibir um arquivo HTML. Existem ferramentas para isso?
O arquivo CSS evoluiu ao longo de alguns anos e, pelo que sei, ninguém jamais removeu nada dele - as pessoas simplesmente escreviam novas regras de substituição repetidas vezes.
EDIT: Foi sugerido o uso de Dust-Me Selectors ou a ferramenta de desempenho de página da Web do Chrome. Mas ambos trabalham no nível de seletores e não em regras individuais. Eu tenho muitos casos em que uma regra dentro de um seletor é sempre substituída - e é disso que eu quero me livrar. Por exemplo:
body { color: white; padding: 10em; }
h1 { color: black; }
p { color: black; }
...
ul { color: black; }
Todo o texto no meu HTML está dentro de algum elemento do invólucro, portanto nunca é branco. body
O preenchimento sempre funciona, então é claro que todo o body
seletor não pode ser removido. E eu gostaria de me livrar dessas regras inúteis também.
EDIT: E outro caso de regra inútil: quando duplica um existente sem alterar nada:
a { margin-left: 5px; color: blue; }
a:hover { margin-left: 5px; color: red; }
Eu ficaria feliz em me livrar do segundo margin-left
... novamente, parece-me que essas ferramentas não encontram essas coisas.
EDIT: Agradeço todas as respostas, mas, infelizmente, as ferramentas que você sugeriu não fizeram nenhuma sugestão útil. Votou suas respostas, mas vou esperar por uma ferramenta que faça as coisas de forma mais granular, conforme especificado acima.
Obrigado,