基础 - SASS 混合宏

---

---

最终的 CSS 输出是使用混合宏构建的。混合宏可以用来根据这些组件构建自己的类结构。以下是用于构建最终 CSS 输出的混合宏。

grid-column

创建网格列。

@include grid-column($columns, $gutter);

grid-column-row

将行和列类等效地包含到同一个元素中。grid-col-row() 是假设的函数。

@include grid-column-row($gutter);

grid-column-collapse

移除填充后，列上的间距会折叠。假设的函数是grid-col-collapse()

@include grid-column-collapse;

grid-column-uncollapse

重新添加填充后，列上的间距会展开。假设的函数是grid-col-uncollapse()

@include grid-column-uncollapse;

grid-layout

设置子元素的大小，以便在$n中指定的数量出现在每一行。

@include grid-layout($n, $selector);

grid-column-position

重新排列列。假设的函数是grid-col-pos()。

@include grid-column-position($position);

grid-column-unposition

重置列位置。假设的函数是grid-col-unpos()。

@include grid-column-unposition;

grid-column-offset

列向右偏移$n列。假设的函数是grid-col-off()。

@include grid-column-offset($n);

grid-column-end

禁用行中最后一列的默认行为，即对齐到相对边。假设的函数是grid-col-end()。

@include grid-column-end;

grid-context

要使用不同的列，应更改在此混合宏中定义的列的行为。

@include grid-context($columns, $root) { }

grid-row

创建一个网格行。

@include grid-row($columns, $behavior, $width, $cf) { }

grid-column-size

设置网格列宽度。

@include grid-column-size($width);