Перейти до вмісту
Monu Tools

Форматувальник CSS

Прикрашайте CSS із чистими відступами або мініфікуйте його, щоб зменшити розмір файлу. Обробляє медіазапити, calc() і ліцензійні коментарі.

Як користуватися Форматувальник CSS

  1. 01

    Вставте свій CSS у поле вводу.

  2. 02

    Оберіть «Прикрасити», щоб відформатувати його, чи «Мініфікувати», щоб стиснути.

  3. 03

    Оберіть розмір відступу, потім скопіюйте результат.

Що робить форматувальник CSS

Це форматувальник CSS, який робить таблиці стилів охайними з чистими, послідовними відступами або стискає їх, щоб зменшити розмір файлу. Ви обираєте розмір відступу для форматування і перемикаєтеся на стискання, коли потрібен найменший результат.

Коли форматувати, а коли стискати

Читабельний CSS легше переглядати, рецензувати і налагоджувати: коли кожне правило і кожне оголошення мають послідовні відступи, ви з першого погляду бачите селектори, вкладеність і форму своїх медіазапитів.

Стискання призначене для робочого середовища. Воно вилучає пробіли й коментарі, які браузерам не потрібні, тож файл завантажується швидше. На великій таблиці стилів заощадження додається, особливо перед стисканням gzip на сервері.

Обережне стискання з calc() і медіазапитами

Стискач обережний там, де це важливо. Він зберігає пробіли навколо плюса і мінуса всередині calc(), тож calc(100% - 30px) залишається коректним, і прибирає пробіли лише навколо структурних символів на кшталт фігурних дужок, двокрапок і крапок з комою. Він також правильно опрацьовує вкладені медіазапити.

Ліцензійні коментарі зберігаються

Ліцензійні коментарі, записані у формі /*! ... */, зберігаються, і це стандартна домовленість, щоб залишати повідомлення про авторські права і ліцензію у стисненому результаті навіть тоді, коли звичайні коментарі прибираються.

Працює у вашому браузері

І форматування, і стискання повністю відбуваються у вашому браузері, тож ваші таблиці стилів ніколи не залишають пристрій. Інструмент форматує для читабельності й розміру; він не перевіряє коректність вашого CSS.

Поширені запитання

Чи ламає мініфікація вирази calc()?

Ні. Мініфікатор зберігає пробіли навколо плюса та мінуса всередині значень, тож calc(100% - 30px) лишається коректним. Він вилучає лише пробіли навколо структурних символів, як-от дужки, двокрапки та крапки з комою.

Чи вилучаються коментарі при мініфікації?

Звичайні коментарі вилучаються для економії місця, але ліцензійні коментарі, записані як /*! ... */, зберігаються, що є стандартним правилом для збереження повідомлень про авторські права.

Чи завантажується мій CSS кудись?

Ні. І прикрашання, і мініфікація виконуються повністю у вашому браузері, тож ваші таблиці стилів ніколи не залишають ваш пристрій.

Джерела

Повідомити про проблему