我们保证每页只显示一个小型广告。别担心，隐藏此消息将确保您不会再次收到烦人的提示。
介绍
列
网格将水平空间划分为不可分割的单位，称为“列”。网格中的所有列都必须指定其宽度，作为总可用行宽度的比例。
所有网格系统都选择任意列数以允许每行。语义的默认主题使用 16 列。
下面的示例显示了在第一行中将适合四个 四列宽 列，16 / 4 = 4，以及第二行中三个不同大小的列。2 + 8 + 6 = 16
可以通过调整语义 UI 的底层 主题变量 来更改默认列数以及网格的其他任意特性。
行
行是水平对齐的列组。
行可以是 显式 的，用额外的 row 元素标记，也可以是 隐式 的，当先前行中没有更多空间时自动出现。
在每组列之后添加垂直间距以分隔每组列，从而创建垂直节奏。
间距
网格列通过称为“间距”的空白区域隔开。间距通过提供页面元素之间的 负空间 来提高可读性。
无论网格的宽度或每行有多少列，间距始终保持恒定的大小。要增加特定网格中间距的大小，可以使用 宽松网格 变体。
负边距
由于所有网格列都包含间距，因此网格使用 负边距 确保第一列和最后一列与网格外面的内容对齐。
在下面的示例中，您可以看到，即使第一行有填充，附加按钮 仍然与网格边缘对齐。
在某些情况下，例如当列或行是 有色 时，您可能希望避免使用负边距。您可以通过使用 填充网格 变体来实现这一点。
列
自动流动
大多数网格不需要指定行。当当前行中的所有网格列都被占用时，内容将自动流到下一行。
列内容
由于列使用填充来创建间距，因此不应直接将内容样式应用于列，而应应用于列内部的元素。
行
分组
行包装器允许您将变体应用于一组列。
不同的网格
嵌套网格
网格可以放置在其他网格内，让您可以细分列。
重要的单词顺序
网格包含许多变体，用于调整垂直或水平对齐、文本对齐或默认间距大小等内容。
某些多词变体，例如 左浮动 或 右对齐 依赖于单词顺序，要求您使用相邻的类名。
左浮动右对齐列
右浮动左对齐列
居中对齐行
居中对齐行
右对齐网格
响应式网格
类型
分隔 需要行
网格可以在其列之间添加分隔线
垂直分隔 需要行
网格可以在行之间添加分隔线
单元格 需要行
网格可以将行划分为单元格
内部单元格 需要行
网格可以仅在内部行之间进行行分隔
内容
行
行是列的水平分组
列
每列都包含间距，使它们与其他列保持相等的间距。
变体
浮动
列可以与行的左侧或右侧边缘对齐
列宽
列的宽度可以变化，占用多个网格列。
列数
网格每行可以有不同数量的列
等宽
网格可以自动调整所有元素的大小，以平均分配可用宽度
1
2
3
1
2
3
4
1
2
3
1
2
拉伸
行可以拉伸其内容以占用整个列高度
1
1
2
1
2
3
1
2
1
2
1
2
1
2
填充
网格可以在第一列和最后一列上保留其垂直和水平间距
以下网格具有垂直和水平间距
以下网格具有垂直间距。
以下网格具有水平间距
宽松
网格可以增加其间距，以允许更多负空间
有色
行或列可以着色
红色
橙色
黄色
橄榄色
绿色
青色
蓝色
紫色
紫色
粉红色
棕色
灰色
黑色
红色
橙色
黄色
橄榄色
绿色
青色
蓝色
紫色
紫色
粉红色
棕色
灰色
黑色
居中
网格可以将其列居中
文本对齐
网格、行或列可以指定其文本对齐方式
对齐的内容完全适合网格列，从一侧到另一侧占用整个宽度。对齐的内容完全适合网格列，从一侧到另一侧占用整个宽度。对齐的内容完全适合网格列，从一侧到另一侧占用整个宽度。对齐的内容完全适合网格列，从一侧到另一侧占用整个宽度。对齐的内容完全适合网格列，从一侧到另一侧占用整个宽度。
垂直对齐
网格、行或列可以指定其垂直对齐方式，使其所有列垂直居中。
响应式变体
加倍
网格可以在平板电脑和移动设备尺寸上将列宽加倍
可堆叠
网格可以在达到移动端断点后将其列堆叠在彼此之上
反转
网格或行可以指定其列在不同设备尺寸下应反转顺序
计算机 A 第四
计算机 A 第三
计算机 A 第二
计算机 A 第一
计算机 B 第四
计算机 B 第三
计算机 B 第二
计算机 B 第一
平板电脑 第四
平板电脑 第三
平板电脑 第二
平板电脑 第一
移动设备 第四
移动设备 第三
移动设备 第二
移动设备 第一
计算机 行 4
计算机 行 3
计算机 行 2
计算机 行 1
平板电脑 行 4
平板电脑 行 3
平板电脑 行 2
平板电脑 行 1
移动设备 行 4
移动设备 行 3
移动设备 行 2
移动设备 行 1
设备可见性
列或行可以仅针对特定设备或屏幕尺寸显示
大屏幕
大屏幕
宽屏
宽屏
移动设备
移动设备
计算机
平板电脑和移动设备
所有尺寸
所有尺寸
计算机
计算机
计算机
计算机
平板电脑
平板电脑
平板电脑
响应式宽度
列可以为特定设备指定宽度