Очиститель CSS

Я занялся поиском довольно сложного сайта, разработанного другой компанией, и, откровенно говоря, это беспорядок. Одна из моих проблем заключается в том, что, по-видимому, не было никакой дисциплины при написании html, так что, хотя они широко использовали css, есть полдюжины css файлов, а беглый анализ показывает, что в файлах css имеется значительное количество стилей на которые не ссылается ни один из html - скорее, они содержат след создания ложных редизайнов и старые, теперь избыточные стили, смешанные с текущими элементами.

Мне бы очень хотелось очистить все это, прежде чем двигаться дальше. Существует ли какой-либо инструмент, открытый исходный код или что-то еще, что может взять кучу html и css файлов и перекрестно ссылаться на них, чтобы выделить крут в css?

Ответ 1

Попробуйте Dust me Selectors подключиться к Firefox.

Ответ 2

Когда вы создаете css в отдельные таблицы стилей, вы можете запустить код через онлайн-инструмент, чтобы убрать макет. Попробуйте один из них:

Ответ 3

пылесосы селекторов имеют почти ту же функциональность, что и мой jquery css cleaner.

и он отлично выглядит

вы можете использовать мой плагин, если у вас нет firefox.

Ответ 4

Я считаю, что есть! И я использую его все время. На самом деле, есть 2, и я собираюсь поделиться ими обоими с вами.

Если вы хотите автоматически создавать CSS из разметки в Интернете, вам необходимо: http://beecss.theextremewebdesigns.com/
Если у вас уже есть (беспорядочный) CSS, и вы хотите очистить его/бесплатно в Интернете, то вам это нужно: http://beecss.theextremewebdesigns.com/css_clean_css_minify/

Я предпочитаю вышеупомянутые инструменты, потому что я уже оценил другие очистители там, и я обнаружил, что у других нет функциональности в некоторых аспектах. Например, некоторые очистители полностью игнорируют несколько классов или просто захватывают первый класс. Они забывают, что следующий класс переопределит стили первого класса, и поэтому очень важно, чтобы все селекторы и классы были сгенерированы и доступны в первую очередь. Я нашел только BeeCSS - CSS Generator, чтобы делать УДИВИТЕЛЬНУЮ работу! С тех пор я добавил в закладки как BeeCSS CSS Generator, так и BeeCSS Cleaner Minifier и использовал их во всех моих проектах. Я настоятельно рекомендую их обоих.

Из моего опыта у меня есть это решение для вас.

Просто скопируйте свой HTML на новую HTML-страницу и сохраните ее. Затем загрузите эту страницу HTML http://beecss.theextremewebdesigns.com/. Это даст вам только селекторов и классов, которые были фактически использованы в документе. Поэтому, если у них есть избыточные стили в файлах CSS, вы можете легко избавиться от них таким образом.
Затем просто выполните поиск классов и селекторов, сгенерированных BeeCSS в исходном файле CSS, и скопируйте эти стили на новый CSS, созданный BeeCSS. Таким образом, вы убедитесь, что ваш CSS теперь будет иметь только стили, используемые HTML-документом.
После завершения копирования и вставки, выполненных выше, вы обнаружите, что появление стилей в CSS может быть беспорядочным. DONT начнет вручную их очищать. Я имею в виду, не пытайтесь исправить вкладки, пробелы и т.д. Просто скопируйте все стили, как они, в BeeCSS - Cleaner Minifier в http://beecss.theextremewebdesigns.com/css_clean_css_minify/, а затем нажмите кнопку "Очистить CSS". Это должно дать вам окончательный результат. Он будет содержать только селектора и классы, которые фактически использовались в документе HTML. Если вы хотите уменьшить размер CSS, просто сгенерируйте мини-версию вашего "нового" css, скопировав стили в BeeCSS Cleaner Miniifer и нажмите кнопку "Минимизировать CSS".

Вышеупомянутые шаги, которые я выполняю, когда я работаю над своими проектами, и они отлично работают для меня. Удивительность BeeCSS заключается в том, что и CSS Generator, и Cleaner Minifier абсолютно бесплатны и просты в использовании, и вы можете создавать/очищать CSS онлайн в течение нескольких секунд. Вам не нужно устанавливать какие-либо расширения, приложения и т.д. Таким образом, вы не будете загружать свой браузер неуклюжими расширениями, и вам не нужно ждать часов, чтобы завершить процесс. Вы будете выполняться в секундах, если будете следовать моим инструкциям (кроме части, копирующей стили)

Надеюсь, что это поможет.

Ответ 5

Там есть новый CSS-сканер на sourceforge. Он ищет коды css, html, aspx, php, javascript и jquery для используемых и неиспользуемых селекторов и классов css/stylesheet. Это может быть именно то, что вы хотите. Он работает под Windows (с его .net-кода). Это URL-адрес, если вы хотите посмотреть: http://sourceforge.net/projects/cssscanner/