CodeUtility
Mach dir das Coderleben leicht!

CSS zu SCSS/Sass Konverter

Konvertiere CSS zu SCSS/Sass und umgekehrt. Sofort Online nutzbar, ideal zum Lernen, Testen und Debuggen – komplett ohne Setup.

Tags: Code konvertieren css css konverter sass scss

🚀 343,829 Gesamtumwandlungen (9 diesen Monat)

Übe Python mit Coding Challenges

Löse praktische Aufgaben direkt im Editor: Führe die Beispieltests aus, reiche ein und erhalte ein KI-Code-Review.

Alle Python-Challenges
Einfach

Rechteck-Umfang

Berechne den Umfang eines Rechtecks anhand seiner Seiten.

Du lernst ArithmetikRückgabewerte
BeginnerLearning-pathVariables
Python C++ C#
3 gelöst
Lösungen anzeigen (3)
Einfach

Skalarprodukt zweier Vektoren

Multipliziere zwei Vektoren elementweise und addiere die Ergebnisse, die Kernoperation jedes Neurons.

Du lernst VektorenSkalarprodukt
Neuronale Netzeaimaschinelles Lernen
Python C++ C#
2 gelöst
Lösungen anzeigen (2)
Einfach

Distance Between Points

Compute the straight-line distance between two points.

Du lernst Satz des PythagorasQuadratwurzeln
BeginnerFunctionsLearning-pathmath
Python C++ C#
1 gelöst
Lösungen anzeigen (1)
Einfach

Count Pairs With a Sum

Count pairs of positions whose values add up to a target.

Du lernst IndexpaareDoppelzählung vermeiden
ArraysBeginnerLearning-pathNested-loops
Python C++ C#
1 gelöst
Lösungen anzeigen (1)
Einfach

Average of Three

Average three whole numbers.

Du lernst ArithmetikDivision
BeginnerLearning-pathVariables
Python C++ C#
1 gelöst
Lösungen anzeigen (1)
Einfach

Kunden und Bestellungen verbinden

Verbinde Kunden wie mit LINQ Join mit ihren Bestellungen und melde den Gesamtumsatz jedes Kunden.

Du lernst LINQ JoinGruppieren
ArraysSorting
Python C++ C#
0 gelöst
Noch keine Lösungen
Einfach

To-do-Liste

Verwalte eine Aufgabenliste: hinzufügen, erledigen, entfernen und melden, was noch offen ist.

Du lernst Typisierte CollectionsRecords
BeginnerSimulationStrings
Python C++ C#
0 gelöst
Noch keine Lösungen
Einfach

Operationen auf einer verketteten Liste

Simuliere eine verkettete Liste: an beiden Enden einfügen, vorne oder nach Wert entfernen und umdrehen.

Du lernst Verkettete ListenSimulation
Data-structuresSimulation
Python C++ C#
0 gelöst
Noch keine Lösungen
Einfach

Ein flaches JSON-Objekt summieren

Parsen Sie ein flaches JSON-Objekt, dessen Werte ganze Zahlen sind, und addieren Sie die Werte.

Du lernst JSON parsenStrings aufteilen
ParsingStrings
Python C++ C#
0 gelöst
Noch keine Lösungen
Einfach

Gesamtzeit mit WhenAll

Finde heraus, wie lange ein Programm dauert, wenn jede Aufgabengruppe gemeinsam mit Task.WhenAll ausgeführt wird und die Gruppen nacheinander laufen.

Du lernst Async/awaitTask.WhenAll
ArraysBeginner
C++ Python C#
0 gelöst
Noch keine Lösungen
Mittel

Reihenfolge paralleler Tasks

Führe Aufgaben gleichzeitig mit höchstens k zur selben Zeit aus und gib die Reihenfolge an, in der sie fertig werden.

Du lernst NebenläufigkeitPrioritätswarteschlangen
SimulationSorting
Python C++ C#
0 gelöst
Noch keine Lösungen
Mittel

Min-Stack

Baue einen Stack, der nach jedem Push oder Pop sofort sein kleinstes Element meldet.

Du lernst StacksLaufendes Minimum
Data-structuresStacks
Python C++ C#
0 gelöst
Noch keine Lösungen

Was ist dieses Tool?

Dieser kostenlose Online-Konverter hilft Ihnen, Ihr CSS sofort in SCSS oder eingerücktes Sass zu verwandeln. Er ist perfekt für Entwickler, die zu modernen, modularen Stylesheets mit Funktionen wie Variablen und Verschachtelung wechseln möchten.

Wie benutzt man es?

  1. Fügen Sie Ihren CSS-Code in den Editor ein oder laden Sie eine Datei hoch.
  2. Klicken Sie auf Konvertieren, um zu SCSS oder Sass zu wechseln.
  3. Laden Sie Ihr konvertiertes Ergebnis herunter, kopieren oder teilen Sie es.

Sie können sich auch mit Google oder GitHub anmelden, um Ihren Konvertierungsverlauf zu speichern und zu verwalten.

Was ist CSS?

CSS (Cascading Style Sheets) ist die Grundlage des Webdesigns. Es steuert das Aussehen und die Haptik von Websites und definiert Layout, Farben, Schriftarten, Abstände, Animationen und Reaktionsfähigkeit.

CSS Beispiel:


p {
  color: red;
  text-align: center;
}

Erfahren Sie mehr im W3Schools CSS Guide.

Was ist SCSS?

SCSS ist eine CSS-kompatible Syntax von Sass mit zusätzlichen Funktionen: Variablen, Verschachtelung, Mixins und Funktionen. SCSS verwendet die .scss-Erweiterung und ist weit verbreitet in groß angelegten Frontend-Projekten.

SCSS Beispiel:


nav {
  ul {
    margin: 0;
    padding: 0;
    list-style: none;
  }

  li {
    display: inline-block;
  }

  a {
    display: block;
    padding: 6px 12px;
    text-decoration: none;
  }
}

Was ist Sass?

Sass (Syntactically Awesome Stylesheets) ist ein Präprozessor, der CSS mit erweiterten Funktionen erweitert. Es gibt zwei Syntaxen:

  • SCSS: CSS-ähnlich mit geschweiften Klammern und Semikolons
  • Sass: Einrückungsbasiert, ohne geschweifte Klammern oder Semikolons

Sass hilft Entwicklern, DRY, wartbare und skalierbare Stylesheets für komplexe Projekte zu schreiben.

Sass (Eingerückt) Beispiel:


nav
  ul
    margin: 0
    padding: 0
    list-style: none

  li
    display: inline-block

  a
    display: block
    padding: 6px 12px
    text-decoration: none

Warum CSS in SCSS/Sass konvertieren?

  • Saubere und organisierte Code-Struktur
  • Wiederverwendbare Komponenten mit Mixins und Variablen
  • Einfachere Wartung und Refactoring

Entdecken Sie Sass und SCSS im Detail in der offiziellen Sass-Dokumentation.