从画布

所有的建造者都可以使用空投区供电画布外元素使用户能够使用元素库中的片段来组合其内容。这是一个巨大的进步，在设计复杂的画布布局的能力。Off Canvas元素由两个组成部分组成:

1. 切换:基本上是一个按钮元素触发Off Canvas的打开 区域。
2. 从画布上:在组合设计时放置元素的实际内容区域。

在本文中，我们将专门关注元素Off Canvas部分可用的样式选项。如果你想了解更多关于Toggle控件的信息，你可以查看我们的文章按钮．

孩子们

Off Canvas元素中的第一个控制组是孩子们控制组，其特点是一个可排序的新元素可以添加，重新排序，并根据需要删除:

这使得使用Off Canvas元素的直接子元素非常容易，而不需要转到全局Outline视图。

设置

接下来是设置控件组，以围绕外观和功能的重要控件的一般集合为特色:

• 基本字体大小:设置字体大小属性在Off Canvas区域本身。这对于为孩子们树立一个新的基本价值观特别有帮助。
• 维度:维度组由各种宽度在上面的截图中找到的控件。如果需要，这些可用于指定Off Canvas区域本身的固定尺寸。
• 文本对齐:应用一个text-align值设置为Off Canvas区域本身，类似于其他布局元素。
• 转型:允许您更改transition-duration而且transition-timing-functionOff Canvas区域应该如何进入和退出。
• 身体滚动:控件上发生的滚动事件可选地禁用身体当一个Off Canvas区域打开时。
• 溢出:默认情况下，Off Canvas的溢出是可见，但您可以设置为隐藏的在这里，如果你希望完成一个特定的外观为您的设计。
• 背景:基地背景颜色可以设置在这里一起启用一个可选”先进的背景,”它允许用户利用英雄图像，视频，视差效果，和更多!

背景＆关闭

的背景＆关闭控制组包含了一组简洁的选项，旨在完成你的Off Canvas元素的整体风格:

而背景而且关闭颜色选择器是相对简单的，有一些特定的控件”关闭”按钮，特别有助于了解它们的功能:

• 密切的大小＆维度:关闭大小”设置基准字体大小在按钮本身，”维”控件指定按钮总体应占用多少物理空间。例如，如果您将基本大小设置为20 px并将尺寸设置为x2.5，按钮的宽度而且高度会出来50 px总的来说，里面的图标只占了底座20 px．注意这一点很重要，因为它决定了画布外区域与屏幕边缘之间的间隔。
• 关闭位置:允许用户指定按钮应该出现在屏幕的哪个角落。

设计

在开头之后”孩子们”而且”设置”对照组，一系列的设计控件是可用的，允许进一步自定义Off Canvas区域。在这些控件中，要注意的一个特别有用的控件是Flexbox设置:

此控件将允许您为Off Canvas区域的直接子区域可选地启用内部flexbox布局上下文。此功能类似于在其他布局元素(如列、单元格或Div)上找到的Flexbox控件。

演示

查看Off Canvas元素的现场演示点击这里．