Перайсці да асноўнага зместу
LibraTool logoLibraTool

Прыгажун CSS — бясплатна

Фарматуйце мінімізаваны CSS з аднолькавымі водступамі або мінімізуйце яго. Дадатковае сартаванне ўласцівасцей па алфавіце для прадказальных адрозненняў.

Працуе афлайн пасля загрузкі

Перацягніце файл сюды або націсніце, каб выбраць

CSS · апрацоўваецца на вашай прыладзе

або націсніце Ctrl+V, каб уставіць з буфера абмену

Выбраць файлы
Адфарматаваны CSS
Вынік з'явіцца тут...

Тыповыя выкарыстанні

  • Адбагаваць CSS прадаваняПаглядзіце мініфаяваны CSS з прадаваных сайтаў ў чытаемым фармаце каб знайсці і зворотна-інжынер стыль.
  • Задаць CSS стыль каманды паслідоўнасцЗапусціце каманду-абяшванны CSS праз паслідоўны красавіца каб дыфы быў пра контэнт, не фарматаванне.
  • Фарматаваць Vendor-префіксаваны CSSVendor-префіксаваны CSS (autoprefixer выхадны) часта ёсць шмат -webkit-, -moz-, -ms- варыянтаў. Фарматаваць каб інспэктаваць.
  • Вывучайце з Pro CSSВывучыце CSS з знакамітых дызайн сістэм па фарматаванні іх скампаліванны выхадны.
  • Фарматаваць CSS каб паведамленняў памылкіПры подачы CSS памылак, фарматаваны CSS значна лёгшэй для рэцэнзентаў каб чытаць і зразумець.

Як гэта працуе

Гэты інструмент фарматуе CSS з дапамогай уласнаручна напісанага рэкурсіўнага разборшчыка, убудаванага непасрэдна ў старонку — без бібліятэкі трэціх бакоў, без выкліку сервера. Разборшчык праходзіцца па вашым CSS сімвал за сімвалам, правільна апрацоўваючы радкі ў двукоссі, значэнні url(), укладзеныя at-правілы і каментарыі, якія б заблыталі прасцейшыя падыходы на аснове рэгулярных выразаў.

  1. 1
    Такенізацыя на ўзроўні сімвалаў
    Функцыя walkCss сканіруе сыры ўвод па адным сімвале за раз, адсочваючы стан двукосся і глыбіню дужак, так што кропкі з коскай ці фігурныя дужкі ўнутры url(), радковых значэнняў ці каментарыяў ніколі не прымаюцца за структурныя раздзяляльнікі.
  2. 2
    Раздзяленне блокаў і дэкларацый
    Калі сканер знаходзіць адкрывальную фігурную дужку верхняга ўзроўню, ён вылучае прэлюдыю (селектар ці ключавое слова at-правіла) і рэкурсіўна апрацоўвае цела блока — якое само можа ўтрымліваць укладзеныя правілы (@media, @supports, нацыўнае ўкладанне CSS), апрацаваныя на большай глыбіні рэкурсіі.
  3. 3
    Сартаванне ўласцівасцяў і водступы
    Дэкларацыі ў кожным блоку збіраюцца ў паслядоўнасць, потым апцыянальна сартуюцца ў алфавітным парадку па назве ўласцівасці перад запісам з абранай шырынёй водступу (2 ці 4 прабелы). Рэжым мінімізацыі цалкам прапускае прабельныя сімвалы і выдаляе каментарыі.
  4. 4
    Імгненны вывад у браўзеры
    Вынікі з'яўляюцца па меры набору тэксту праз хук useMemo — нічога нікуды не адпраўляецца. Фарматаваны ці мінімізаваны CSS можна скапіяваць у буфер абмену ці спампаваць як файл .css, і панэль паказвае розніцу ў памеры ў параўнанні з арыгіналам.

Звязаныя інструменты

🌐

Прыгажун і мінімізатар HTML

Фарматуйце або мінімізуйце HTML з правільным водступам укладання. Захоўвае змест унутры блокаў <pre>, <script>, <style>.

Паспрабуйце
🗄️

Фарматавальнік і прыгажун SQL

Фарматуйце SQL-запыты з правільным водступам, наладжвальным рэгістрам ключавых слоў і пераносам радкоў пры асноўных выразах. Працуе з любым дыялектам SQL.

Паспрабуйце
🗜️

Мінімізатар і фарматавальнік CSS

Мінімізуйце CSS для памяншэння памеру файла або фарматуйце мінімізаваны CSS для зручнасці чытання. Імгненна, у вашым браўзеры.

Паспрабуйце

Часта задаюць пытанні