Operators

Other topics

Assignment Operator

Sass uses the colon (:) operator to assign values to variables.

Example

$foreColor: red;

p {
    color: $foreColor;
}

Arithmetic Operators

Sass supports the following standard arithmetic operators:

OperatorDescription
+Addition
ā€“Subtraction
*Multiplication
/Division
%Remainder

Examples

p {
    font-size: 16px + 4px; // 20px
}
h3 {
    width: 2px * 5 + 12px; // 22px
}
h2 {
    width: 8px + (12px / 2) * 3; // 26px
}

Normal order of operations applies as usual.

Comparison Operators

Sass supports all the usual comparison operators: <,>,==,!=,<=,>=.

Examples

(10px == 10) // Returns true

("3" == 3) // Returns false

$padding: 10px;
$padding <= 8px; // Returns false

Contributors

Topic Id: 3047

Example Ids: 10357,10358,10359

This site is not affiliated with any of the contributors.