DasCSS Modul für benutzerdefinierte Funktionen und Mixins ermöglicht es Entwicklern, wiederverwendbare Blöcke von CSS-Code zu erstellen, die Argumente annehmen, komplexe Logik enthalten können (definiert durch Funktionen wie CSSif() und@media At-Regeln) und basierend auf dieser Logik Werte zurückgeben.

CSS benutzerdefinierte Funktionen werden in@function At-Regeln definiert und mit der<dashed-function> Syntax aufgerufen. Diese sieht derCSS benutzerdefinierte Eigenschaft Syntax sehr ähnlich, jedoch beinhalten sie am Ende Klammern mit Argumenten (zum Beispiel,--my-function(30px, 3)). CSS benutzerdefinierte Funktionen können in jedem Eigenschaftswert aufgerufen werden und geben einen Wert zurück, der auf den übergebenen Argumenten und der Logik innerhalb der Funktion basiert.

CSS Mixins werden in@mixin At-Regeln definiert und unter Verwendung von@apply At-Regeln innerhalb von Regelsets angewendet. CSS Mixins definieren eine Reihe von Eigenschaften, die in mehreren Regelsets wiederverwendet und mit Argumenten und Logik angepasst werden können.

CSS benutzerdefinierte Funktionen und Mixins können optionale Datentypen für ihre Argumente und Rückgabewerte zugewiesen werden, um die Werte, die in sie hinein- und aus ihnen herausgegeben werden, zu beschränken.

Referenz

At-Regeln und Deskriptoren

• @function
  • result

Das CSS Modul für benutzerdefinierte Funktionen und Mixins führt auch die@mixin,@apply,@contents und@env At-Regeln ein. Derzeit unterstützt kein Browser diese Funktionen.

Datentypen und Werte

• <dashed-function>

Funktionen

• type()

Schnittstellen

• CSSFunctionRule
• CSSFunctionDeclarations
• CSSFunctionDescriptors

Leitfäden

Verwendung von CSS benutzerdefinierten Funktionen

Dieser Leitfaden zeigt Ihnen, wie Sie CSS benutzerdefinierte Funktionen verwenden und präsentiert einige typische Anwendungsfälle.

Spezifikationen

Siehe auch

• if()
• @media