Sass参考（Sass Reference）
优质
小牛编辑
129浏览
2023-12-01
变量 (Variables)
您可以使用表中列出的以下SASS变量来更改组件的样式。
| Sr.No. | 名称和描述 | 类型 | 默认值 |
|---|---|---|---|
| 1 | $table-background 应用表格的背景颜色。 | Color | $white |
| 2 | $table-color-scale 它指定使条纹表行和边框变暗的比例。 | Number | 5% |
| 3 | $table-border 它定义了表边框的样式。 | List | 1px固体智能秤（$ table-background，$ table-color-scale） |
| 4 | $table-padding 它提供了表的填充。 | Number | rem-calc（8 10 10） |
| 5 | $table-hover-scale 它指定在悬停时使条纹表行变暗的比例。 | Number | 2% |
| 6 | $table-row-hover 在悬停时应用标准行的颜色。 | List | darken($table-background, $table-hover-scale) |
| 7 | $table-row-stripe-hover 在悬停时应用条带行的颜色。 | List | 变暗（$ table-background，$ table-color-scale + $ table-hover-scale） |
| 8 | $table-striped-background 它为条带行提供背景颜色。 | Color | smart-scale($table-background, $table-color-scale) |
| 9 | $table-stripe 它显示表行上的条带。 如果行是偶数，则偶数行将具有背景颜色，如果行是奇数，则奇数行将具有背景颜色。 如果row为空或任何其他值，则表行将没有条带。 | Keyoword | even |
| 10 | $table-head-background 它指定标题背景的颜色。 | Color | 智能规模（$ table-background，$ table-color-scale/2） |
| 11 | $table-foot-background 它指定页脚背景的颜色。 | Color | smart-scale($table-background, $table-color-scale) |
| 12 | $table-head-font-color 它定义标题的字体颜色。 | Color | $body-font-color |
| 13 | $show-header-for-stacked 它使用堆栈表时显示标题的defualt值。 | Boolean | false |
Mixins
您可以使用mixins为组件构建CSS类结构，如下所述 -
表
它可以使用以下mixin添加表格和样式的样式 -
@include table($stripe);
它使用下表中定义的参数 -
| Sr.No. | 参数和描述 | 类型 | 默认值 |
|---|---|---|---|
| 1 | $stripe 它使用偶数，奇数或无值显示表行上的条带。 甚至是默认值。 | Keyword | $table-stripe |
table-scroll
它使用以下mixin水平滚动表格 -
@include table-scroll;
table-hover
它通过使用以下mixin悬停在表行上 -
@include table-hover;
table-stack
它为堆叠表添加样式。
@include table-stack($header);
它使用下表中定义的参数 -
| Sr.No. | 参数和描述 | 类型 | 默认值 |
|---|---|---|---|
| 1 | $header 它在表格堆叠时显示标题。 | Boolean | $show-header-for-stacked |