使用指南/创建内容/设计/“行”和“堆叠”区块

“行”和“堆叠”区块

“行”区块“堆叠”区块是其他区块的容器。它们可以用于排列多个区块,以及调整容器内所有区块的颜色、文本样式、宽度和位置。这些区块是“组”区块的变体。

添加“行”区块或“堆叠”区块

您可以从一个空的“行/堆叠”区块开始,或者将现有区块组合成行或堆叠。

从空白区块开始

要添加空的“行/堆叠”区块,请点击“+ 区块插入器”按钮,然后搜索“行”或“堆叠”。点击区块即可将其添加到文章或页面。您还可以使用键盘另起一行输入 /row/stack,然后按下“Enter”键,从而快速添加新的“行/堆叠”区块

Adding a row block with the slash command.

有关添加区块的详细说明,请点击此处查看。

添加“行/堆叠”区块后,点击“+ 区块插入器”图标即可开始在行或堆叠内添加区块。

使用现有区块

对于页面上已有的区块,您可以按照以下步骤将它们组合成一个“行/堆叠”区块

  1. 选择您要组合在一起的区块。您可以通过以下方式选择多个区块:
    • 使用鼠标选中区块。
    • 点击第一个区块,然后按住键盘上的“Shift”键并点击最后一个区块。这样您将选中第一个和最后一个区块之间的所有区块。
    • 列表视图下,点击第一个区块,然后按住键盘上的“Shift”键并点击最后一个区块。这样您将选中第一个和最后一个区块之间的所有区块。
  2. 在区块上方或下方出现的区块工具栏中,点击“”图标(看起来像两个并排的半正方形)、“堆叠”图标(看起来像两个上下排列的半正方形)或“网格”图标,以进行网格布局:
An arrow points to the group icons in the block toolbar.
点击区块工具栏中的行或堆叠图标,将现有区块组合在一起

“行”和“堆叠”区块工具栏

在您点击区块后,界面上将出现一个选项工具栏:

The Row block toolbar that appears above the Row block with icons for block type, move block, and more described below.
“行”区块工具栏
The Stack block toolbar that appears above the Stack block with icons for block type, move block, and more described below.
“堆叠”区块工具栏

“行”区块“堆叠”区块的工具栏提供以下选项:

  • 更改区块类型或样式
  • 拖动区块。
  • 上下移动区块。
  • 更改项目对齐方式:向左、居中、向右和在各项目之间留间距。
  • 将内容对齐到顶部、中部、底部或拉伸填充。
  • 更改对齐方式:无、加宽、全宽。
  • 更多选项

“行”和“堆叠”区块设置

选择一个区块后,您会在右侧边栏中找到其他区块设置。如果您没有看到边栏,您可能需要点击右上角的设置图标以打开设置。这个图标看起来像两个宽窄不一的栏目拼在一个方框里面:

编辑器里的设置图标,其下有提示信息“设置”。
点击此“设置”图标,打开区块设置

“行”区块“堆叠”区块包含以下区块设置:

转换为另一种组变体

点击区块设置顶部的图标以更改为另一种变体:

布局

在“布局”设置中,您可以设置行或堆叠区块的对齐方式。选择向左、居中、向右或两端对齐,以调整容器内内容的对齐方式。

通过“方向”选项,您可以从行(水平布局)切换到堆叠(垂直布局)。

此外,您可以打开或关闭将内容换行以显示为多行的功能。这对于在移动设备等较小屏幕上查看您页面的用户非常有用,因为此时内容可能无法全部显示在一行内。

The Layout section of the Block Settings sidebar, with the options to set justification, orientation and wrap options.

位置

使用“位置”设置,您可以在“默认”和“置顶”之间进行选择:

  • 默认:滚动到页面的其他板块时,滚动过去的该区块将消失。
  • 置顶:即使滚过最初添加该区块的位置,该区块也会浮动在页面上并保持可见。在列表视图中,区块旁将显示一个钉子图标。
Default position is highlighted, with Sticky shown underneath.

高级

如需了解更多相关信息,请访问我们关于高级设置的详细说明。

“行”和“堆叠”区块样式

在区块设置边栏中点击“样式”图标,访问区块的设计设置。“样式”图标是一个圆圈形状,圆圈的一半被填满:

箭头指向“样式”图标,点击该图标即可打开区块样式板块。

颜色、排版、尺寸和边框

在此处,您可以设置文本颜色、背景颜色、文本大小和字体、内边距、边距以及区块间距。请参考下列指南,了解有关如何使用这些设置的更多详情:

背景图片

与所有“组”区块变体一样,在“行”区块“堆叠”区块样式中,您可以设置要显示在区块内容后的图片或渐变色。如需获取有关添加背景图片的分步说明,请参阅“组”区块指南

宽度设置(嵌套区块)

宽度设置出现在嵌套于“行/堆叠”区块内的各个区块的设置中,而非在“行/堆叠”区块设置本身中。

要访问这些设置,请点击“行/堆叠”区块内的单个区块,然后在区块设置边栏中查找“宽度”选项(该选项可能会出现在“样式”选项卡下):

The Dimensions width settings, showing Fit, Grow, and Fixed.

有三个宽度选项可供选择:

  • 适应:区块会根据内容自动缩放,仅占用所需空间。
  • 扩展:区块会扩展以填满行或堆叠内的所有可用空间。
  • 固定:区块会设为您定义的特定宽度,无论周围内容或容器大小如何。

取消区块组合

如果您想移除某个“行/堆叠”区块,但不想清除其内部区块,则您可以取消区块组合。请按照以下步骤操作:

  1. 在编辑屏幕的顶部选择列表视图
  2. 选择“行/堆叠”区块
  3. 点击“行/堆叠”区块旁边的三个点
  4. 选择“取消组合”选项。
Ungrouping a Row block.
Copied to clipboard!