Was ist Sass?

Sass, eine Erweiterung von CSS, ist ein Akronym für syntaktisch fantastische Stylesheet. SASS ist im Grunde ein Pre-Processor von CSS, der gut mit allen Versionen von CSS zusammenarbeitet und die Fähigkeit der Grundsprache verbessert. Es ist bekannt, dass es viel Zeit und Mühe speichert, indem sie verhindern, dass die Benutzer redundante CSS-Werte verwenden. Dieser Artikel betont die Bedeutung von SASS, um mehr Wissen über den gesamten Artikel zu erfassen.

Hintergrund von Sass

Syntaktisch großartiges Stylesheet (SASS) wurde ursprünglich von Hampton Catlin erstellt und 2006 von Natalie Weizenbaum erweitert. Später erweiterte Natalie Weizenbaum zusammen mit Chris Eppstein die Originalversion auf Sassscript, eine in SASS -Dateien verwendete Skriptsprache.

Eigenschaften von Sass

Einige Unterscheidungsmerkmale von SASS sind unten aufgeführt.

1. Sass ist eine JS-basierte CSS-Erweiterung.
2. Sass arbeitet in Harmonie mit allen Versionen von CSS.
3. Es hat mehr Potentialität und Stabilität im Vergleich zu CSS.
4. Die Syntax von Sass kompiliert in lesbare CSS.
5. Es ist ein Open-Source-Präprozessor, der in CSS übersetzt wird.
6. Es unterstützt die Verwendung von Variablen, Verschachteln, Mixins usw.
7. Es bietet Kontrollrichtlinien für Bibliotheken und viele nützliche Funktionen für verschiedene Werte.
8. Sass -Dateien haben a .SCSS -Erweiterung.
9. Das Kommentieren in SASS ähnelt CSS. Sie können im Sass -Code entweder / * * / /// einen Kommentar abgeben.
10. Die Ausgabe von SASS ist vollständig strukturiert und kann zugeschnitten werden.

Voraussetzungen von Sass

Um SASS besser zu verstehen, müssen Sie die folgenden ein gutes Verständnis haben.

1. Html
2. CSS

Was ist die Bedeutung von Sass

Die Bedeutung von SASS kann durch die Tatsache hervorgehoben werden. Es ermöglicht die Verwendung von Variablen, Verschachteln, Mixins, Vererbung, Importen, Funktionen usw.

Wie funktioniert Sass

SASS verwendet einen Vorprozessor, um den Code in lesbare CSS-Code umzuwandeln, da der SASS-Code vom Webbrowser nicht verständlich ist. Dieses Verfahren zur Konvertierung eines SASS-Code in CSS wird als Transporation bezeichnet und der Vorverarbeitungsor dieser Funktion wird als Transpiler bezeichnet.

Beispiel für Sass

Um die Arbeit von Sass zu verstehen, folgen Sie dem unten dargestellten Beispiel.

Szenario
Nehmen wir an, dass die Website, die Sie entwickeln, nur zwei Arten von Schriftfamilien für den Text auf den Webseiten verwendet. Anstatt immer wieder die Schriftnamen der Schriftart zu schreiben, können Sie SASS -Variablen erstellen und ihnen Werte zuweisen. Anschließend können Sie die Namen dieser Variablen überall in Ihrer Quellcode -Datei verwenden. So machst du es.

$ family_1: Times New Roman;
$ family_2: Verdana;
.H1
Schriftfamilie: $ family_2;

.P
Schriftfamilie: $ family_1;

.Fusszeile
Schriftfamilie: $ family_1;

Im obigen Code haben wir zunächst zwei SASS -Variablen deklariert und ihnen die gewünschten Werte zugewiesen. Jetzt verwenden wir diese Variablen in unserem Stylesheet, um unsere verschiedenen Elemente zu stylen. Sie können SASS -Variablen auf ähnliche Weise für andere Werte wie Farbe, Größe usw. erzeugen.

Abschluss

Syntaktisch großartiges Stylesheet (SASS) ist eine Erweiterung von CSS. Es ist im Grunde genommen ein Pre-Processor von CSS, der gut mit all seinen Versionen funktioniert und die Fähigkeit der Grundsprache verbessert. Es spart viel Zeit und Mühe, indem sie verhindert, dass die Benutzer redundante CSS -Werte verwenden. Darüber hinaus können Sie Ihre Stylesheets schneller strukturieren. In diesem Artikel wird SASS im Detail erläutert und seine Bedeutung zusammen mit seinen Unterscheidungsmerkmalen und vielem mehr hervorhebt.