Less in CSS umwandeln — Numio
Kompiliere Less in deinem Browser zu CSS. Variablen, Verschachtelung, Mixins und Operationen werden vom offiziellen less.js-Compiler in reines CSS aufgelöst, sodass du die Ausgabe prüfen kannst, ohne lessc zu installieren.
Das CSS prüfen, das Less-Variablen, Verschachtelung und Mixins erzeugen.
Less
CSS
Wann sie hilft
- Das CSS prüfen, das Less-Variablen, Verschachtelung und Mixins erzeugen.
- Eine kleine Less-Datei für ein Projekt umwandeln, das reines CSS verwendet.
Anwendung
- Füge Less-Code ein oder öffne eine .less-Datei.
- Wähle die Vendor-Präfix-Einstellung für die Browser, die du unterstützt.
- Prüfe das erzeugte CSS und kopiere es dann.
Less-Eingabe
@primary: #2563eb;
.button {
color: @primary;
&:hover { text-decoration: underline; }
}CSS-Ausgabe
.button {
color: #2563eb;
}
.button:hover {
text-decoration: underline;
}Details und Einschränkungen
Eine undefinierte Variable oder eine nicht geschlossene Klammer bricht die Kompilierung ab. Beginne bei der Fehlersuche mit einem kurzen Snippet.
Die Kompilierung läuft in deinem Browser. Ein @import einer externen URL kann den Browser dazu bringen, diese Ressource abzurufen; verwende daher möglichst eigenständigen Code.
Imports anderer lokaler Dateien, Less-Plugins und projektspezifische Compiler-Optionen sind nicht verfügbar. Vendor-Präfixe hängen von der Einstellung der Zielbrowser ab.
FAQ
Ist das dasselbe wie Kompilieren mit lessc?
Es verwendet less.js, denselben Compiler, den lessc ausführt. Eine eigenständige Datei ergibt mit Standardoptionen also dasselbe CSS. Projektfunktionen wie lokale Imports und Plugins sind hier nicht verfügbar.
Kann ich eine Datei kompilieren, die @import verwendet?
Imports, die auf andere Dateien auf deinem Rechner verweisen, lassen sich im Browser nicht auflösen. Füge den importierten Code direkt ein oder kompiliere das ganze Projekt mit lessc.
Was ist der Unterschied zwischen Less und CSS?
Less ist ein CSS-Präprozessor. Er ergänzt Variablen, Verschachtelung, Mixins und Funktionen und muss zu CSS kompiliert werden, bevor ein Browser ihn verwenden kann.