基礎 - 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);