Від автора: вбудована функція if () повертає тільки один результат з двох можливих, грунтуючись на заданому умові. Результат Sass функції можна пов’язати з змінної, яку не потрібно визначати окремо або використовувати для подальших обчислень.
Синтаксис
if( вираз, значення1, значення2 )
Приклад
У наступному прикладі продемонстровано використання функції if() у файлі SCSS:
Control Directives & Expressions
Welcome to TutorialsPoint
Потім створіть файл style.scss.
h2 {
color: if( 1 + 1 == 2 , green , red);
}
За допомогою наступної команди ви можете вказати SASS переглядати файл і оновлювати CSS кожен раз, коли змінюється файл SASS:
sass –watch C:\ruby\lib\sass\style.scss:style.css
Потім виконайте наведену вище команду; вона автоматично створить файл style.css з наступним кодом:
h2 {
color: green;
}
Результат на виході
Давайте виконаємо наступні дії, щоб побачити, як працює наведений вище код:
Збережіть наведений вище HTML-код у файлі if_function.html.
Відкрийте HTML-файл у браузері, ви повинні побачити наступне: