Операторы отношения

Операторы отношения определяют, являются ли числа больше или меньше друг друга. Они автоматически конвертируют между совместимыми единицами.

  • <expression> < <expression> возвращает, является ли значение первого выражения меньше второго.
  • <expression> <= <expression> возвращает, является ли значение первого выражения меньшим или равным второму.
  • <expression> > <expression> возвращает, является ли значение первого выражения больше второго.
  • <expression> >= <expression>, возвращает, является ли значение первого выражения больше или равно второму.

SCSS Syntax

@debug 100 > 50; // true
@debug 10px < 17px; // true
@debug 96px >= 1in; // true
@debug 1000ms <= 1s; // true

Sass Syntax

@debug 100 > 50  // true
@debug 10px < 17px  // true
@debug 96px >= 1in  // true
@debug 1000ms <= 1s  // true

Безразмерные числа можно сравнивать с любым числом. Они автоматически конвертируются в единицы этого числа.

SCSS Syntax

@debug 100 > 50px; // true
@debug 10px < 17; // true

Sass Syntax

@debug 100 > 50px  // true
@debug 10px < 17  // true

Номера с несовместимыми блоками сравнивать нельзя.

SCSS Syntax

@debug 100px > 10s;
//     ^^^^^^^^^^^
// Error: Incompatible units px and s.

Sass Syntax

@debug 100px > 10s
//     ^^^^^^^^^^^
// Error: Incompatible units px and s.