Як користуватися
- Вставте CSS, відкрийте файл
.cssабо почніть зі зразка. - Мінімізований CSS з'являється під час введення разом із розміром до та після обробки.
- Скопіюйте його або завантажте як
styles.min.css.
Що він робить
Мінімізатор CSS використовує CSSO, який робить більше, ніж просто видаляє пробіли та коментарі:
- Скорочує значення:
#ff0000перетворюється наred,0px— на0, аpadding: 0 16px 0 16px— наpadding: 0 16px. - Об'єднує правила з однаковим селектором і селектори з однаковими оголошеннями.
- Видаляє оголошення, які перевизначає пізніше оголошення в тому самому правилі.
Він вносить лише зміни, що зберігають значення таблиці стилів, тому вигляд сторінок не змінюється.
Чи варто це робити?
Таблиці стилів блокують показ сторінки, доки не завантажаться, тому менший CSS означає швидше перше відображення. Мінімізація зазвичай заощаджує ще від 5 до 15% понад стиснення gzip або Brotli, яке застосовує ваш хостинг, і більше, якщо таблиця стилів містить багато коментарів. Якщо ви використовуєте засіб збирання, наприклад Vite, він уже мінімізує CSS для робочої версії; ця сторінка призначена для таблиць стилів, які ви пишете й публікуєте вручну.
Поширені запитання
Чи може мінімізація зламати мій CSS?
Зміни CSSO зберігають значення коректного CSS. Прийоми для старих браузерів, що залежать від некоректного синтаксису, можуть перестати працювати. Зберігайте читабельну версію як джерело та мінімізуйте копію.
Чи видаляє він невикористаний CSS?
Ні: він не бачить, які селектори використовують ваші сторінки. Такі засоби, як PurgeCSS, роблять це під час збирання.
Як повернути читабельну версію?
Зберігайте оригінал. Форматувальник CSS відновлює відступи мінімізованого CSS, але коментарі втрачаються назавжди.
Чи надсилається мій CSS на сервер?
Ні. Він мінімізується у вашому браузері.