CSS Szépítő és Tömörítő

Igazítsa újra a rendezetlen CSS-t az olvashatóságért, vagy tömörítse az élesítéshez – egy olyan biztonságos móddal, amely soha nem rendezi át a szabályokat.

Behúzás
Tömörítés
Illessze be vagy gépelje be a CSS-kódot a szépítéshez vagy tömörítéshez.

A CSS formázása és tömörítése teljesen a böngészőjében történik. Semmi sem kerül feltöltésre a BroBroGo szervereire.

GYIK

Mi a különbség a szépítés és a tömörítés között?

A szépítés (beautify) újrarendezi a behúzásokat és szóközöket, hogy a stíluslapok könnyen olvashatók és szerkeszthetők legyenek. A tömörítés (minify) ennek az ellenkezőjét teszi: eltávolítja a böngésző számára felesleges szóközöket és megjegyzéseket, valamint lerövidíti az értékeket (például a színkódokat), így a fájl kisebb lesz és gyorsabban betöltődik. Munka közben használja a szépítést, élesítés előtt pedig a tömörítést.

Mit csinálnak a Biztonságos és az Optimalizált tömörítési beállítások?

A „Biztonságos” (Safe) mód csak a szóközöket és megjegyzéseket távolítja el, valamint lerövidíti az értékeket, de minden szabályt pontosan ott hagy, ahol megírta. Az „Optimalizált” (Optimized) mód ennél tovább megy: összevonja az ismétlődő szelektorokat és szabályokat a még kisebb fájlméret érdekében. Ez módosíthatja a szabályok sorrendjét, így a forráskód sorrendjére érzékeny stíluslapoknál élesítés előtt érdemes egy gyors ellenőrzést végezni. A /*! … */ formátumú megjegyzések mindkét módban megmaradnak.

Megváltoztatja a tömörítés az oldalam megjelenését?

Biztonságos (Safe) módban nem – a stílusok pontosan ugyanúgy fognak megjelenni. Ez a mód eltávolítja a felesleges szóközöket, a hagyományos megjegyzéseket, és rövidebb, egyenértékű formára írja át az értékeket (például a #ffffff kódot #fff formátumra), de soha nem változtatja meg a böngésző-specifikus előtagokat (vendor prefixes) vagy a modern szintaxist. Az Optimalizált mód szabályokat is összevon, ami szinte minden stíluslapnál teljesen azonos megjelenést eredményez, de érdemes ellenőrizni, ha a kód a szabályok sorrendjére épül.

HTML Szépítő és TömörítőIgazítsa újra az összekuszálódott HTML-t az olvashatóságért, vagy tömörítse az élesítéshez – opcionális hibás tag-ellenőrzéssel.SVG OptimalizálóTisztítsa meg az SVG-kódot és csökkentse a méretét a grafika megváltoztatása nélkül.JavaScript Szépítő és TömörítőIgazítsa újra a tömörített vagy titkosított JavaScript-et, hogy olvasható legyen, vagy tömörítse saját kódját a kisebb fájlméretért.CSS clamp() kalkulátorAdja meg a kis és nagy képernyőkhöz tartozó méretet, és kapjon egy folyékony clamp() értéket, amely zökkenőmentesen skálázódik a kettő között – betűméretekhez, belső és külső margókhoz vagy résekhez.Színátmenet generátorHozzon létre lineáris, radiális vagy kúpos színátmenetet, adjon hozzá színpontokat, állítsa be az irányt, és másolja ki a CSS-t egyetlen kattintással.Box Shadow generátorHúzza a csúszkákat a box-shadow alakításához, halmozzon fel rétegeket a mélységért, és másolja ki azonnal a kész CSS-kódot.SzínkonvertálóKonvertáljon színeket HEX, RGB, HSL, HSV, CMYK és LAB formátumok között – szerkesszen bármely mezőt, és a többi automatikusan frissül.JSON formázóFormázza, ellenőrizze és tömörítse a JSON-t azonnal.