alat za programere / 16

Formatiranje i sređivanje CSS-a

Formatirajte, uvucite i proširite CSS pravila, liste selektora i deklaracije svojstava u čitljiv kod.

Formatiranje i sređivanje CSS-a: TOEA analizira CSS pravila, media upite i deklaracije, a zatim ujednačava razmake oko svojstava i uvlačenje blokova. Radi 100% lokalno u vašem pregledaču, bez otpremanja datoteka na server.

Kategorija: Alatke za programere
Pokretanja: U vašem pregledaču
Trošak: Besplatno · bez registracije
Dostupnost: Spremno za upotrebu

Formatiranje i ulepšavanje CSS kodaLokalna obrada

U potpunosti radi u vašem pregledaču

Formatirani CSS kôd

body {
  font-family: system-ui,sans-serif;
  line-height: 1.5;
  color: #333;
  margin: 0;
}

.header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 2rem;
  background: #f8f9fa;
}

.header a {
  color: #0066cc;
  text-decoration: none;
}

.header a:hover {
  text-decoration: underline;
}

@media (max-width:600px) {
  .header {
    flex-direction: column;
    padding: 1rem;
  }
}

Čitanje tuđeg stilskog lista

Formatiranje minifikovanog fajla čini ga čitljivim, ali ga ne vraća u isti oblik kao izvor iz kog je nastao: minifikatori spajaju pravila i menjaju redosled deklaracija, pa očekujte grupisane selektore i skraćene vrednosti. Da biste pronašli koje pravilo stilizuje element, alati za programere u pregledaču su brži, a njihov panel Sources može odmah da formatira minifikovani fajl. Formatiranjem dve verzije stilskog lista i njihovim poređenjem u alatu Provera razlika videćete šta je ažuriranje promenilo.

Šta formatiranje ne menja

Formatiranje dodaje uvlačenje i razmake; ne sortira svojstva, ne ispravlja pogrešno napisana imena svojstava, ne dodaje prefikse proizvođača niti uklanja duple deklaracije, pa colour: red ostaje nepromenjeno. Nizovi razmaka sažimaju se svuda, uključujući i razmake unutar niska pod navodnicima, zato proverite vrednosti content koje zavise od više razmaka. Kada je fajl spreman za objavljivanje, ponovo ga kompresujte pomoću alata Minifikator CSS-a.

Kako se koristi

Nalepite sirovi ili minifikovani CSS kod.
Izaberite uvlačenje od 2 ili 4 razmaka.
Kliknite na „Formatiraj CSS“, a zatim kopirajte ili preuzmite rezultat.

Privatnost i ograničenja

Svo formatiranje CSS-a obavlja se lokalno u vašem pregledaču.

Srodne alatke

Često postavljana pitanja

Da li podržava @media upite?

Da, ugnježđena at-pravila i media upiti formatiraju se uz pravilno uvlačenje.

Da li menja kodove boja ili selektore?

Ne, formatiranje prilagođava razmake, uvlačenje i strukturu, bez menjanja vrednosti svojstava.

Besplatan alat · pokretanja: u vašem pregledaču · nalog nije potreban