CSS minifikators un pārveidotājs bez maksas
Minificē CSS, lai samazinātu faila izmēru, vai pārveidojiet minificētu CSS lasāmībai. Tūlītēji, pārlūkprogrammā.
Nometiet .css failu šeit vai noklikšķiniet, lai izvēlētos
CSS · apstrādāts jūsu ierīcē
vai nospiediet Ctrl+V, lai ielīmētu no starpliktuves
Biežākie lietojumi
- Minificējiet CSS ražošanas izvietošanaiSamaziniet CSS faila lielumu pirms ražošanas izvietošanas — ātrāka lapas ielāde un zemākas joslas platuma izmaksas.
- Skaistojiet minificētu CSS atkļūdošanaiFormatējiet saspiestu vai minificētu CSS nolasāmā kodā, lai varētu pārbaudīt un atkļūdot stiliem.
- Minificējiet CSS e-pasta veidnēmKompaktajiet CSS HTML e-pasta veidnēm, kur faila lielums un iekļautā stila pūpolums ir svarīgs.
- Minificējiet CSS WordPress tēmāmSamaziniet pielāgoto WordPress tēmas CSS lielumu labākiem PageSpeed rezultātiem.
- Skaistojiet CSS koda pārskateiFormatējiet jebkuru CSS failu tīrā, atkāpJuma, nolasāmā kodā, kas ir gatavs pārskatei un sadarbībai.
Kā tas darbojas
Šis rīks izmanto pašrakstītu, bez atkarībām CSS tokenizatoru, kas veidots pilnībā JavaScript — bez ārējām bibliotēkām, bez servera izsaukumiem. Tokenizators klasificē katru rakstzīmi kā kodu, komentāru, citētu virkni vai url() vērtību, pirms tiek pielietoti jebkādi pārveidojumi, kas novērš atstarpju noteikumu bojāšanu virkņu saturam, datu URI vai calc() izteiksmēm.
- 1Tokenizācijas gājiensIevades CSS tiek skenēts rakstzīmi pa rakstzīmei un sadalīts tipizētos marķieros: neapstrādāti koda segmenti, /* ... */ komentāri, citētas virknes (saglabājot izbēgšanas secības) un url(...) bloki. Tas nodrošina, ka nākamā soļa pārveidojumi skar tikai īstu CSS sintaksi — nekad virknes literāļa vai datu URI saturu.
- 2Minifikācija vai skaistošanaMinifikācijas režīmā parastie komentāri tiek nomesti (/*! licence */ komentāri tiek saglabāti), atstarpju sērijas koda marķieros tiek sakļautas vienā atstarpē, un pieturzīmēm blakus esošās atstarpes ap { } : ; , > ~ tiek noņemtas. Atstarpes ap + un - tiek apzināti atstātas neskartas, lai nesabojātu calc() izteiksmes. Skaistošanas režīmā kods vispirms tiek minificēts līdz tīrai bāzei, tad atkārtoti tokenizēts un atkārtoti atkāpts ar divu atstarpju dziļuma izsekošanu un deklarācijas-kola noteikšanu, lai atšķirtu īpašība: vērtība kolus no selektoru koliem, piemēram, a:hover.
- 3Gzip izmēra novērtējumsPēc izvades radīšanas pārlūkprogrammas vietējā CompressionStream API tiek izmantota, lai saspiestu rezultātu ar gzip un izmērītu iegūto baitu skaitu. Tas dod reālistisku pārraides izmēra novērtējumu, kas atbilst tam, ko nosūtītu tīmekļa serveris ar gzip saspiešanu.
- 4Kopēt vai lejupielādētApstrādātais CSS tiek ierakstīts starpliktuvē caur Clipboard API vai lejupielādēts kā styles.min.css (minifikācijas režīms) vai styles.css (skaistošanas režīms), izmantojot Blob ar MIME tipu text/css. Izmēra samazinājuma procenti tiek rādīti dzīvajā laikā, kamēr rakstāt.
Saistītie rīki
SVG optimizētājs un minifikators
Noņem metadatus, sabrūk baltaizstarpas un noapaļo decimālas, lai dramatiski samazinātu SVG faila izmēru — tipiskais samazinājums ir 30-70%. Vizuālais priekšskatījums pārbauda, ka nekas nesabojājas.
CSS pārveidotājs
Noformējiet minimizētu CSS ar vienmērīgu atkāpju lietojumu vai minimizējiet to. Pēc izvēles īpašību kārtošana alfabēta secībā paredzamām atšķirībām.
JSON formatēšana
Formatējiet, validējiet, minimizējiet un pētiet JSON datus. Koka skats, sintakses izcelšana un kopēšana ar vienu klikšķi.