Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.

View in English Always switch to English

CSS Custom-Funktionen und Mixins

Das Modul CSS Custom-Funktionen und Mixins ermöglicht es Entwicklern, wiederverwendbare Blöcke von CSS-Code zu erstellen, die Argumente akzeptieren können, komplexe Logik enthalten (definiert unter Verwendung von Funktionen wie CSS if() und @media At-Regeln) und basierend auf dieser Logik Werte zurückgeben können.

CSS Custom-Funktionen werden in @function At-Regeln definiert und unter Verwendung der <dashed-function> Syntax aufgerufen. Diese Syntax ähnelt stark der von CSS Custom-Eigenschaften mit dem Unterschied, dass sie Klammern am Ende enthält, die Argumente beinhalten (zum Beispiel --my-function(30px, 3)). CSS Custom-Funktionen können innerhalb eines jeden Eigenschaftswertes aufgerufen werden und geben einen Wert zurück, basierend auf den in die Funktion übergebenen Argumenten und der Logik in ihr.

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

CSS Custom-Funktionen und Mixins können optionale Datentypen für ihre Argumente und Rückgabewerte zugewiesen werden, um die übergebenen und zurückgegebenen Werte einzuschränken.

Hinweis: Derzeit haben nur CSS Custom-Funktionen Browser-Support. CSS Mixins werden derzeit in keinem Browser unterstützt.

Referenz

At-Regeln

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

Deskriptoren

Datentypen und Werte

Funktionen

Das Modul CSS Custom-Funktionen und Mixins führt auch lokale env() Variablen ein. Derzeit wird diese Funktion von keinem Browser unterstützt.

Schnittstellen

Leitfäden

Verwendung von CSS Custom-Funktionen

Dieser Leitfaden lehrt Sie, wie man CSS Custom-Funktionen verwendet und präsentiert einige typische Anwendungsfälle.

Spezifikationen

Specification
CSS Functions and Mixins Module

Siehe auch