Les fonctions

Syntaxe

  • @function nom-fonction(paramètre) { /* Corps de la fonction */ }

Les fonctions de base

Une fonction ressemble à un mixin mais elle n’ajoute aucun style, elle ne renvoie qu’une valeur. Les fonctions doivent être utilisées pour éviter la logique répétée dans vos styles.

Sass a quelques fonctions intégrées qui sont appelées en utilisant la syntaxe de fonction CSS standard.

h1 {
    background: hsl(0, 25%, 50%);
}

Les fonctions sont déclarées en utilisant la syntaxe ci-dessous,

@function multiply(x, y) {
    @return x * y;
}

// example use below
h1 {
    margin-top: multiply(10px, 2);
}

Dans le code ci-dessus, @function déclare une fonction et @return signifie la valeur de retour.

← Mélanges
Extension Héritage →