Funkcja math() w Sass umożliwia wykonywanie podstawowych operacji matematycznych na wartościach. Może być użyta do obliczania wartości w jednostkach takich jak piksele, em czy procenty.
Aby użyć math() w Sass, należy zastosować następującą składnię:
$value: math($expression);
$expression oznacza wyrażenie matematyczne, które chcemy obliczyć. Może to być dowolne wyrażenie zawierające liczby i operatory matematyczne, takie jak +, -, * i /.
Przykład użycia math() w Sass:
$width: 1000px;
$padding: 20px;
$columns: 3;
.column {
width: math(($width - (($columns - 1) * $padding)) / $columns);
}
W powyższym przykładzie obliczamy szerokość kolumny na podstawie szerokości kontenera, ilości kolumn i marginesów między nimi. W tym celu wykorzystujemy funkcję math(), aby obliczyć szerokość każdej kolumny.
Najpierw definiujemy szerokość kontenera $width, marginesy $padding i ilość kolumn $columns. Następnie w regule CSS .column wykorzystujemy math(), aby obliczyć szerokość każdej kolumny. W tym celu odejmujemy szerokość marginesów między kolumnami (z pominięciem ostatniej kolumny) od szerokości kontenera, a następnie dzielimy wynik przez ilość kolumn.