等值运算符

兼容性（无单位等值）
Dart Sass
✓
LibSass
✗
Ruby Sass
自 4.0.0 版（未发布）起

LibSass 和旧版本的 Ruby Sass 将没有单位的数字视为与具有任何单位的相同数字相等。此行为已弃用，并已从最近的版本中删除，因为它违反了[传递性](https://en.wikipedia.org/wiki/Transitive_relation)。

等值运算符返回两个值是否相同。它们写成 <expression> == <expression>，它返回两个[表达式](/documentation/syntax/structure#expressions)是否相等，以及 <expression> != <expression>，它返回两个表达式是否不相等。如果两个值类型相同且值相同，则认为它们相等，这意味着对于不同类型，含义不同。

  • [数字](/documentation/values/numbers)如果具有相同的值和相同的单位，或者如果在单位之间转换后它们的值相等，则认为它们相等。
  • [字符串](/documentation/values/strings)的不寻常之处在于，具有相同内容的[未加引号](/documentation/values/strings#unquoted)和[加引号](/documentation/values/strings#quoted)字符串被认为是相等的。
  • [颜色](/documentation/values/colors)如果它们位于相同的[颜色空间](/documentation/values/colors#color-spaces)并具有相同的通道值，或者如果它们都位于[旧版颜色空间](/documentation/values/colors#legacy-color-spaces)并具有相同的 RGBA 通道值，则认为它们相等。
  • [列表](/documentation/values/lists)如果其内容相等，则认为它们相等。逗号分隔列表与空格分隔列表不相等，带括号的列表与不带括号的列表不相等。
  • [映射](/documentation/values/maps)如果它们的键和值都相等，则认为它们相等。
  • [计算](/documentation/values/calculations)如果它们的名称和参数都相等，则认为它们相等。操作参数按文本方式进行比较。
  • [true, false](/documentation/values/booleans) 和 [null](/documentation/values/null) 仅与其自身相等。
  • [函数](/documentation/values/functions)与其自身相同的功能相等。函数按引用进行比较，因此即使两个函数具有相同的名称和定义，如果它们未在同一位置定义，则认为它们是不同的。
游乐场

SCSS 语法

@debug 1px == 1px; // true
@debug 1px != 1em; // true
@debug 1 != 1px; // true
@debug 96px == 1in; // true

@debug "Helvetica" == Helvetica; // true
@debug "Helvetica" != "Arial"; // true

@debug hsl(34, 35%, 92.1%) == #f2ece4; // true
@debug rgba(179, 115, 153, 0.5) != rgba(179, 115, 153, 0.8); // true

@debug (5px 7px 10px) == (5px 7px 10px); // true
@debug (5px 7px 10px) != (10px 14px 20px); // true
@debug (5px 7px 10px) != (5px, 7px, 10px); // true
@debug (5px 7px 10px) != [5px 7px 10px]; // true

$theme: ("venus": #998099, "nebula": #d2e1dd);
@debug $theme == ("venus": #998099, "nebula": #d2e1dd); // true
@debug $theme != ("venus": #998099, "iron": #dadbdf); // true

@debug true == true; // true
@debug true != false; // true
@debug null != false; // true

@debug get-function("rgba") == get-function("rgba"); // true
@debug get-function("rgba") != get-function("hsla"); // true
游乐场

Sass 语法

@debug 1px == 1px  // true
@debug 1px != 1em  // true
@debug 1 != 1px  // true
@debug 96px == 1in  // true

@debug "Helvetica" == Helvetica  // true
@debug "Helvetica" != "Arial"  // true

@debug hsl(34, 35%, 92.1%) == #f2ece4  // true
@debug rgba(179, 115, 153, 0.5) != rgba(179, 115, 153, 0.8)  // true

@debug (5px 7px 10px) == (5px 7px 10px)  // true
@debug (5px 7px 10px) != (10px 14px 20px)  // true
@debug (5px 7px 10px) != (5px, 7px, 10px)  // true
@debug (5px 7px 10px) != [5px 7px 10px]  // true

$theme: ("venus": #998099, "nebula": #d2e1dd)
@debug $theme == ("venus": #998099, "nebula": #d2e1dd)  // true
@debug $theme != ("venus": #998099, "iron": #dadbdf)  // true

@debug calc(10px + 10%) == calc(10px + 10%)  // true
@debug calc(10% + 10px) == calc(10px + 10%)  // false

@debug true == true  // true
@debug true != false  // true
@debug null != false  // true

@debug get-function("rgba") == get-function("rgba")  // true
@debug get-function("rgba") != get-function("hsla")  // true