Многие веб-мастеры, которые предпочитают грамотный и минималистичный код, всегда удаляют лишний CSS со страниц. Раньше для Mozilla Firefox были плагины DustMe Selectors и CSS Usage, но их поддержка прекратилась и даже установив старую версию Mozilla воспроизвести их работу не удалось. Да и в CSS за это время произошло очень много изменений, поэтому мы признали их неактуальными.
Чем заменить DustMe Selectors и CSS Usage?
На данный момент мы нашли только одно адекватное решение для минимализации CSS на странице — это расширение CSS Used для Google Chrome. После установки активируйте расширение, нажав на иконку в верхнем правом углу:
После этого в консоли разработчика (запускается по F12) после клика по элементу в правой области появится пункт «CSS Used»:
После перехода в CSS Used автоматически происходит генерация нового CSS, в котором есть только те стили, которые используются на странице. Нажмите кнопку «Copy» чтобы скопировать получившийся код. В нем CSS удобно разделен комментариями на блоки. В комментариях прописано из какой таблицы выведен код.
Единственным минусом данного метода является то, что он работает для одной страницы, а не для всего сайта.