使用两列或三列布局

您可以使用多列部分布局来自动确定添加到布局的组件的间隔和排列。

要将布局添加到页中,请执行以下操作:

  1. 导航到您要编辑的页,并确保 “编辑”开关 设置为编辑
  2. 向页中添加布局。
  3. 要将其他内容放置在部分布局中,请将该内容拖放到布局上。

    布局使用实线边框突出显示,并带有显示“添加项”的横幅。
    GUID-01FF01BB-7DB2-47CE-BEC2-EF46C1A8056F-default.png 的说明如下
    图示 GUID-01FF01BB-7DB2-47CE-BEC2-EF46C1A8056F-default.png 的说明

    您可以继续将项添加到布局,布局将相应对其设置格式。您甚至可以添加其他部分布局以创建复杂的布局,或者添加组件组。

    下面是图像组件作为占位符的两列布局:


    GUID-E47530CF-CB6F-4E41-ADC2-8BE0DE42F4CA-default.png 的说明如下
    图示 GUID-E47530CF-CB6F-4E41-ADC2-8BE0DE42F4CA-default.png 的说明

    如果添加更多项,则这些项显示在额外的行中,每一行最多显示两个项。

  4. 要编辑组件及其外观,请单击其菜单图标 “组件菜单”图标,然后选择设置
  5. 使用“一般信息”选项卡可以修改布局中单独组件的设置。
    单击组件名称可查看该组件的设置。
  6. 使用“背景”选项卡可修改布局的背景设置。
  7. 选择定制设置可设置有关所显示内容的其他默认设置。
    • 第一列宽度 (%):以布局可用空间百分比形式指定列宽度。

    • 第二列宽度 (%):以布局可用空间百分比形式指定列宽度。

    • 第三列宽度 (%):以布局可用空间百分比形式指定列宽度。

    • 响应断点(以像素为单位):对于在可用显示大小改变时自动重新设置内容格式的响应页设计,指定部分布局在标准两列布局和您在下面指定的响应行为选项之间切换的宽度(以像素为单位)。

    • 响应行为:选择在可用显示大小小于响应断点值时布局如何更改。

      • 无操作:不调整布局行为。

      • 堆叠列:在单一列中从上到下排列项,第二列中的项排在第一列中的所有项之后,以此类推。

      • 隐藏第一列:隐藏第一列中的内容以便为其余列提供更多空间。

      • 隐藏第二列:隐藏第二列中的内容以便为其余列提供更多空间。

      • 隐藏第三列:隐藏第三列中的内容以便为其余列提供更多空间。

      • 隐藏这两列:隐藏布局中的所有内容。

      • 将第二列移动到第一列之下:在单一列中排列项,第二列中的所有项排在第一列中的所有项之后。

      • 将第一列移动到第二列之下:在单一列中排列项,第一列中的所有项排在第二列中的所有项之后。