Sass Basics: Operators

Sass is quite popular and tends to be an essential tool for every front-end developer. Sitepoint has already published some introductory articles about this CSS preprocessor language.

In this article, we'll continue exploring Sass by diving into its operations.

Note: The examples will be based on Ruby Sass. I also suggest you to have a look at Hugo's article, which discusses Sass-Compatibility.

Assignment Operator

Sass uses the colon (:) operator to define a variable. For instance:

$main-color: lightgray;

Arithmetic Operators

Arithmetic operators are used to perform the standard arithmetic operations.

Here are the arithmetic operators that Sass supports:

Operator	Description
+	Addition
-	Subtraction
*	Multiplication
/	Division
%	Remainder

As we'll see in an upcoming section, the addition operator (+) can also be used to concatenate strings.

Note that the operators above work only for numbers with compatible units:

Continue reading %Sass Basics: Operators%

by George Martsoukos via SitePoint