Поиск неиспользуемых селекторов CSS
Сравните таблицу стилей со страницей HTML и получите список селекторов, не имеющих совпадений.
Поиск неиспользуемых селекторов CSS
Вставьте таблицу стилей на одну сторону и HTML, который она оформляет, на другую — и этот инструмент выведет каждый селектор, который не совпадает ни с одним элементом на странице. Это быстрый способ найти неиспользуемые правила, оставшиеся после редизайна, удаления компонента или месяцев копирования CSS — тот вид беспорядка, который утомительно искать вручную в файле с сотнями правил.
«Игнорировать псевдо-классы и псевдо-элементы» сравнивает правило вроде .button:hover как простой .button, поскольку статический снимок HTML не может показать состояния наведения или фокуса; отключите эту опцию, и инструмент проверит те, которые он может безопасно проверить — first-child, last-child, nth-child и not — на реальное положение каждого элемента. «Игнорировать селекторы по шаблону» принимает регулярное выражение или простой текстовый фрагмент в качестве резервного варианта, чтобы исключить классы, которые скрипт переключает во время выполнения, такие как любой класс, начинающийся с js- или is-active, чтобы они никогда не помечались как неиспользуемые. «Показать классы/ID HTML без правила CSS» переворачивает сравнение, полезно для выявления опечаток в именах классов. «Включить селекторы внутри @media» проверяет правила в медиа-запросах так же, как остальную таблицу стилей, или пропускает их при отключении. Переключите вывод на «Очищенный CSS», чтобы получить таблицу стилей с удаленными всеми неиспользуемыми правилами.
Сравнение выполняется с HTML-структурой в том виде, в котором она написана — разметка, введенная скриптом после загрузки страницы, отсутствует в вставленном снимке, поэтому перепроверьте перед удалением правила. Селекторы, объединенные запятыми, проверяются отдельно, поэтому правило, охватывающее два класса одновременно, удаляется только после подтверждения того, что оба класса не используются.
Все происходит в вашем браузере: CSS и HTML, которые вы вставляете, никогда не загружаются куда-либо. Скопируйте результат, загрузите его как файл .txt или отправьте обратно на вход, чтобы запустить еще один проход.