Sass til CSS
Kompilér Sass og SCSS til CSS online. Realtidskonvertering med udvidet eller komprimeret output, fejllinjer og fuld understøttelse af variabler, mixins og nesting.
Hvad er forskellen mellem Sass og SCSS?
SCSS er den nyere, CSS-lignende syntaks med tuborg og semikoloner. Sass (den indrykkede syntaks) bruger indrykning og linjeskift. Dette værktøj kompilerer begge - vælg bare syntaks i rullemenuen.
Hvilke Sass-funktioner understøttes?
Kompileren bruger den officielle Dart Sass-motor, så variabler, nesting, mixins, @include, funktioner, @use, @extend, kontrol-direktiver som @if og @each samt komprimeret outputstil understøttes alle.
Hvordan får jeg komprimeret CSS?
Indstil outputstil-menuen til Komprimeret før kompilering. Mellemrum og det afsluttende semikolon fjernes, hvilket giver det mindst mulige stylesheet.
Hvorfor viser fejlen et linjenummer?
Når din kode har en syntaksfejl, rapporterer Sass-motoren den nøjagtige linje og kolonne, hvor parsingen fejlede, og værktøjet viser det over outputtet, så du hurtigt kan rette det.
Bliver min Sass-kode uploadet til en server?
Nej. Hele Dart Sass-motoren er bundlet med siden og kompilerer lokalt i browseren. Dine stylesheets forlader aldrig din enhed - sikkert selv til private projekter.
Kan jeg kompilere @import af lokale filer?
Nej. Kompileren arbejder på ét kodestykke i hukommelsen og har ingen adgang til dit filsystem, så filbaserede imports og @use af eksterne partials kan ikke løses.
Virker det offline?
Ja. Når siden og kompilatorpakken er indlæst én gang, sker kompileringen helt på din maskine, uden forbindelse.
Hvordan bruger jeg resultatet?
Kopiér den kompilerede CSS til udklipsholderen eller download den som style.css med knapperne under outputtet, og link den i din HTML eller indsæt den i projektets stylesheet.
Sådan bruges Sass til CSS
Denne kompiler kører den officielle Dart Sass-motor helt i din browser. Indsæt SCSS eller indrykket Sass og få ren CSS med det samme — variabler, mixins, indlejring og funktioner understøttes, intet uploades.
- Indsæt din Sass- eller SCSS-kode i inputfeltet, eller tryk Eksempel for at indlæse en fungerende demo med variabel og mixin.
- Vælg syntaks (SCSS eller indrykket Sass) og outputstil (Expanded eller Compressed) i rullemenuerne.
- Med Live-kompilering slået til opstår CSS'en, mens du skriver; ellers trykker du Kompilér for at køre den manuelt.
- Ved en syntaksfejl vises det præcise linjenummer og beskeden over outputtet, så du hurtigt kan rette det.
- Brug Kopiér eller Download under outputtet til at hente dit kompilerede stylesheet som style.css.
Vælg outputstilen Compressed for at minificere dit stylesheet — fint til produktionsbuilds direkte fra kilden.
Relaterede værktøjer
- CSS-forskønner Formatér og forskøn CSS-kode øjeblikkeligt. Konverter minifieret CSS til læsbar kode med justerbare muligheder.
- CSS-minifierer Gratis online CSS-minifierer. Komprimer og optimer CSS-kode øjeblikkeligt ved at fjerne mellemrum, kommentarer og unødvendige tegn. Reducer filstørrelsen for hurtigere web-ydelse.
- CSS-gradientgenerator Opret fantastiske CSS-gradienter visuelt. Generer lineære, radielle og koniske gradienter med flere farvestop, vinkler og positioner. Kopier produktionsklar CSS-kode øjeblikkeligt.
- CSS Flexbox-generator Visuel CSS Flexbox-generator med live forhåndsvisning. Juster flex-egenskaper og få CSS-kode klar til brug.
- Chmod-beregner Gratis online chmod-beregner til at visualisere og beregne Linux-filrettigheder med afkrydsningsfelter. Konverter straks mellem numerisk (755, 644) og symbolsk notation (rwxr-xr-x). Understøtter specielle rettigheder som setuid, setgid, sticky bit.
- ASCII-tabel Komplet ASCII-tegnkodningsreference med decimal-, hex-, oktal-, binærkoder, HTML-entiteter og tegnbeskrivelser. Øjeblikkelig søgning og filtrering.
- HTTP-anmodning Tester Test REST API'er direkte i din browser. Send GET-, POST-, PUT-, DELETE-anmodninger med brugerdefinerede headers, body og parametre. Se svarstatus, headers og JSON-body øjeblikkeligt.
- .htaccess-generator Generer Apache .htaccess-regler for omdirigeringer, omskrivninger, sikkerhedshoveder, caching og mere.