16Controlling Flow with @if

You can make your mixins even more powerful by making certain things happen only under specific circumstances. You do this using @if. This gating mechanism, also known as a conditional statement, is a common feature of programming languages, so you might be familiar with it.

To start your statement, you write the @if keyword. After that, you put a statement that will evaluate to true or false. For example, 20 > 10 would evaluate to true. And, "hello" == "world" would evaluate to false. Other common comparators are available, such as == (equal to), != (not equal to), > (greater than), and < (less than).

If the statement is true, whatever is inside the following declaration block will be executed. If the statement ...

Get Pragmatic Guide to Sass 3 now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.