描述
该@mixin指令用于定义混入。它可选地在mixin名称之后包括变量和参数。
例
以下示例演示了SCSS文件中@mixin的使用。
sample.htm
<html>
<head>
<title> Mixin example of sass</title>
<link rel = "stylesheet" type = "text/css" href = "sample.css"/>
</head>
<body>
<div class = "cont">
<h1>Example using include</h1>
<h3>Directive is used to define the Mixins, it includes variables and argument optionally.</h3>
</div>
</body>
</html>接下来，创建文件sample.scss。
sample.scss
@mixin style {
.cont{
color: #77C1EF;
}
}
@include style;您可以使用以下命令，让SASS监视文件并在SASS文件更改时更新CSS-
sass --watch C:\ruby\lib\sass\sample.scss:sample.css
接下来，执行以上命令；它将使用以下代码自动创建sample.css文件-
sample.css
.cont {
color: #77C1EF;
}输出量
让我们执行以下步骤，看看上面给出的代码如何工作：
- 将上面给定的html代码保存在sample.htm文件中。
- 在浏览器中打开此HTML文件，显示如下所示的输出。
作者：terry，如若转载，请注明出处：https://www.web176.com/sass/1679.html
支付宝 
微信 