在本章中，我们将深入探讨 Stylus 中的各种运算符及其使用方法。Stylus 提供了多种运算符来处理数值和颜色值，使样式表的编写更加灵活和高效。
数值运算符
数值运算符用于执行基本的数学运算，包括加法、减法、乘法、除法和取模。这些运算符可以应用于整数或浮点数。
加法
加法运算符是 +。它用于将两个数值相加。
width = 100px margin = 10px total-width = width + margin
上述代码中，total-width 的值为 110px。
减法
减法运算符是 -。它用于从一个数值中减去另一个数值。
height = 300px padding = 50px content-height = height - padding
在这个例子中，content-height 的值为 250px。
乘法
乘法运算符是 *。它用于将一个数值与另一个数值相乘。
base-font-size = 16px scale-factor = 1.5 scaled-font-size = base-font-size * scale-factor
在此示例中，scaled-font-size 的值为 24px。
除法
除法运算符是 /。它用于将一个数值除以另一个数值。
container-width = 800px column-count = 4 column-width = container-width / column-count
在这个例子中，column-width 的值为 200px。
取模
取模运算符是 %。它用于获取两个数值相除后的余数。
total-width = 900px column-width = 200px columns = total-width % column-width
在这里，columns 的值为 100px。
颜色运算符
颜色运算符允许对颜色进行各种操作，包括混合颜色、调整亮度、饱和度等。
颜色混合
颜色混合运算符是 + 和 -。它们用于将两种颜色混合在一起。
color1 = #ff0000 color2 = #00ff00 mixed-color = color1 + color2
在这个例子中，mixed-color 的值为 #ff7f00，这是一种橙色。
调整颜色
Stylus 提供了一些内置函数来调整颜色的亮度、饱和度和透明度。
调整亮度
亮度调整函数是 lighten() 和 darken()。
base-color = #ff0000 light-color = lighten(base-color, 20%) dark-color = darken(base-color, 20%)
在此示例中，light-color 的值为 #ff7f7f，而 dark-color 的值为 #cc0000。
调整饱和度
饱和度调整函数是 saturate() 和 desaturate()。
base-color = #ff0000 more-saturated-color = saturate(base-color, 20%) less-saturated-color = desaturate(base-color, 20%)
在这个例子中，more-saturated-color 的值为 #ff4d4d，而 less-saturated-color 的值为 #cc0000。
调整透明度
透明度调整函数是 rgba() 或 opacity()。
base-color = #ff0000 transparent-color = rgba(base-color, 0.5)
在此示例中，transparent-color 的值为 rgba(255, 0, 0, 0.5)。
比较运算符
比较运算符用于判断两个数值之间的关系，包括等于、不等于、大于、小于、大于等于和小于等于。
等于
等于运算符是 ==。它用于判断两个数值是否相等。
a = 10 b = 10 isEqual = a == b
在这个例子中，isEqual 的值为 true。
不等于
不等于运算符是 !=。它用于判断两个数值是否不相等。
a = 10 b = 20 isNotEqual = a != b
在此示例中，isNotEqual 的值为 true。
大于
大于运算符是 >。它用于判断左边的数值是否大于右边的数值。
a = 20 b = 10 isGreaterThan = a > b
在这个例子中，isGreaterThan 的值为 true。
小于
小于运算符是 <。它用于判断左边的数值是否小于右边的数值。
a = 10 b = 20 isLessThan = a < b
在此示例中，isLessThan 的值为 true。
大于等于
大于等于运算符是 >=。它用于判断左边的数值是否大于或等于右边的数值。
a = 10 b = 10 isGreaterThanOrEqual = a >= b
在这个例子中，isGreaterThanOrEqual 的值为 true。
小于等于
小于等于运算符是 <=。它用于判断左边的数值是否小于或等于右边的数值。
a = 10 b = 20 isLessThanOrEqual = a <= b
在此示例中，isLessThanOrEqual 的值为 true。
逻辑运算符
逻辑运算符用于组合条件表达式，包括与、或和非。
与
与运算符是 and。它用于判断两个条件是否同时为真。
a = true b = false result = a and b
在这个例子中，result 的值为 false。
或
或运算符是 or。它用于判断两个条件中是否有至少一个为真。
a = true b = false result = a or b
在此示例中，result 的值为 true。
非
非运算符是 not。它用于反转一个条件的结果。
a = true result = not a
在这个例子中，result 的值为 false。
字符串运算符
字符串运算符主要用于连接两个字符串。
连接
连接运算符是 +。它用于将两个字符串连接在一起。
str1 = 'Hello' str2 = 'World' full-str = str1 + ' ' + str2
在此示例中，full-str 的值为 'Hello World'。
通过以上介绍，我们了解了 Stylus 中的多种运算符及其用途。这些运算符使得样式表的编写更加灵活和强大。接下来，我们将学习如何在实际项目中应用这些知识。