混入是 Stylus 中非常重要的一个特性，它允许你定义一组可重用的样式，并在其他选择器或混入中引用它们。这不仅减少了代码的冗余，还能提高代码的可维护性。
什么是混入？
混入是一种可以被多次调用的代码块，它允许你在不同的地方使用相同的样式定义。通过这种方式，你可以避免重复编写相同的样式代码，从而简化和优化你的 CSS。
定义混入
定义混入非常简单，只需要使用 mixin 关键字即可。下面是一个简单的例子：
// 定义一个名为 rounded 的混入
rounded(radius)
border-radius radius在这个例子中，我们定义了一个名为 rounded 的混入，它可以接受一个参数 radius。这个混入的功能是在元素上设置圆角边框。
使用混入
一旦定义了混入，就可以在其他地方通过其名称来调用它。调用混入的方式与调用函数类似，只需要传入相应的参数即可。例如：
// 在其他样式定义中调用混入
.container
width 100%
height 300px
background-color #f5f5f5
rounded(10px) // 调用上面定义的 rounded 混入，并传递参数 10px默认参数
有时候，你可能希望某些混入参数具有默认值。这样，在未提供这些参数时，它们将自动使用预设的值。在 Stylus 中，可以通过在定义混入时为参数指定默认值来实现这一点。
-- -------------------- ---- -------
-- -------------
------------------ - ----- ---- - -------
------- ----
--------- ----
---------------- -----
------ ----
------ -------
-------
------- --在这个例子中，button-style 混入有两个参数：color 和 size。如果在调用时没有为这两个参数提供值，那么它们将分别采用默认值 blue 和 medium。
使用带默认参数的混入
当使用带有默认参数的混入时，你可以选择性地覆盖其中的一些或全部参数。
.button-primary
button-style(red, large) // 覆盖了 color 参数，保持 size 参数为默认值在这个例子中，button-style 混入中的 color 参数被显式地设置为了红色，而 size 参数则保留了默认的 medium 值。
多个混入
在实际项目中，你可能会需要多个混入来处理不同的样式需求。这些混入可以独立定义，也可以相互组合使用。下面是一个例子，展示了如何定义并组合使用多个混入。
-- -------------------- ---- -------
-- ------
---------------------
------------- ------
------------------
---------- ------
-- ------
------------
-------------------
------------ --- --- ------- -- -- -----在这个例子中，我们首先定义了两个单独的混入 border-radius 和 box-shadow，然后在一个新的选择器 .rounded-box 中同时使用了这两个混入。这样做可以使代码更加模块化，便于管理和扩展。
匿名混入
除了命名混入外，Stylus 还支持匿名混入，即那些不直接命名的混入。这些混入通常用于简化特定场景下的样式定义。匿名混入可以直接插入到样式规则中，无需先定义再引用。
.container
width 100%
height 300px
background-color #f5f5f5
{
border-radius 10px
box-shadow 0 4px 8px rgba(0, 0, 0, 0.1)
}在这个例子中，我们直接在 .container 选择器内插入了两个样式规则，这实际上相当于使用了匿名混入来应用样式。
结论
混入是 Stylus 中非常强大的工具，它可以帮助你更有效地组织和重用代码。通过合理地使用混入，不仅可以减少代码量，还可以提高代码的可读性和可维护性。希望本章的内容能帮助你更好地理解和使用 Stylus 中的混入功能。