在 SCSS（Sass 的一个语法糖，它是 CSS 的一个超集，意味着所有的 CSS 都是有效的 SCSS，但 SCSS 提供了额外的功能和语法）中，@include 指令用于将一个 mixin（混合）的内容包含（或插入）到当前的选择器中。Mixin 是一种在 SCSS 中定义可重用样式块的方式，它们可以包含属性、选择器，甚至是嵌套规则。

当你使用 @include 指令时，你实际上是在告诉 SCSS 编译器将指定的 mixin 中定义的样式规则复制到当前的选择器中。这允许你创建可重用的样式块，并在需要时将它们包含到不同的选择器中，从而减少代码的重复和提高样式的可维护性。

下面是一个简单的例子来说明 @include 是如何工作的：

// 定义一个 mixin，它包含了一些样式规则
@mixin border-radius($radius) {
  -webkit-border-radius: $radius;
     -moz-border-radius: $radius;
      -ms-border-radius: $radius;
          border-radius: $radius;
}

// 使用 @include 指令将 mixin 的内容包含到 .box 选择器中
.box {
  @include border-radius(10px);
  background-color: blue;
}

在这个例子中，我们定义了一个名为 border-radius 的 mixin，它接受一个参数 $radius 并定义了四个不同浏览器前缀的 border-radius 属性。然后，我们在 .box 选择器中使用 @include 指令将 border-radius(10px) 的样式规则包含进来。编译后的 CSS 将如下所示：

.box {
  -webkit-border-radius: 10px;
     -moz-border-radius: 10px;
      -ms-border-radius: 10px;
          border-radius: 10px;
  background-color: blue;
}

通过使用 @include 和 mixin，我们可以轻松地重用样式规则，并在需要时调整参数来适应不同的设计需求。

在 Less 中，确实有与 SCSS 中 @include 指令类似的功能，它允许你将一组 CSS 属性或选择器封装到一个可重用的模块中，并在需要时将其包含（或插入）到其他选择器中。这个功能在 Less 中通常通过“混合”（mixins）来实现。

Less 中的混合使用 .class（或 #id）的语法来定义，并通过 .（或 &，用于嵌套规则中）来调用。这与 SCSS 中使用 @mixin 和 @include 的方式有所不同，但概念上是相似的。

下面是一个 Less 中混合使用的例子：

// 定义一个混合，它包含了一些样式规则
.border-radius(@radius) {
  border-radius: @radius;
  -webkit-border-radius: @radius;
  -moz-border-radius: @radius;
}

// 使用混合，将其内容包含到 .box 选择器中
.box {
  .border-radius(10px);
  background-color: blue;
}

在这个例子中，我们定义了一个名为 .border-radius 的混合，它接受一个参数 @radius 并定义了 border-radius 及其浏览器前缀属性。然后，我们在 .box 选择器中使用 .border-radius(10px) 来包含这个混合的样式规则。

编译后的 CSS 将如下所示：

.box {
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  background-color: blue;
}