内容组件 content-components
设计电子邮件、登陆页、模板和可视化片段的内容时，请使用内容组件添加可视化设计元素。 您可以根据需要在定义布局的一个或多个结构组件中添加任意数量的内容组件。
内容库
组件库底部的 Contents 部分显示可用的内容组件：
内容组件工具栏
在画布中选择每个内容组件类型后，都会显示一个工具栏。 可用的工具因组件类型而异，它们提供了一种在渲染的内容中直接使用组件的简单方法。 它包括适用于组件类型的格式化和功能功能。
格式化工具
| table 0-row-3 1-row-3 html-authored | ||
|---|---|---|
| 工具 | 使用情况 | 组件 |
|
将粗体、斜体、下划线、删除线、上标或下标应用于所选文本字符串。 |
|
| table 0-row-3 1-row-3 html-authored | ||
|---|---|---|
| 工具 | 使用情况 | 组件 |
|
对组件内容应用水平对齐类型。 选择“左”、“居中”、“右”或“对齐”。 |
|
| table 0-row-3 1-row-3 html-authored | ||
|---|---|---|
| 工具 | 使用情况 | 组件 |
|
对组件文本应用排序或未排序列表格式。 |
|
| table 0-row-3 1-row-3 html-authored | ||
|---|---|---|
| 工具 | 使用情况 | 组件 |
|
将标题级别格式应用到光标位置的段落。 |
|
| table 0-row-3 1-row-3 html-authored | ||
|---|---|---|
| 工具 | 使用情况 | 组件 |
|
将字体大小应用到所选文本。 单击该工具，然后选择尺寸或输入像素值。 |
|
| table 0-row-3 1-row-3 html-authored | ||
|---|---|---|
| 工具 | 使用情况 | 组件 |
|
将字体颜色应用于所选文本。 从选取器中选择一种颜色，然后使用颜色滑块和颜色字段来选择颜色。 或者，您可以输入已知的RGB、HSL、HSB或十六进制值。 |
|
| table 0-row-3 1-row-3 html-authored | ||
|---|---|---|
| 工具 | 使用情况 | 组件 |
|
为所选文本或元素创建可单击链接（外部URL或登陆页面）。 |
|
| table 0-row-3 1-row-3 html-authored | ||
|---|---|---|
| 工具 | 使用情况 | 组件 |
|
删除所选文本或元素的可单击链接（外部URL或登陆页面）。 |
|
功能工具
将内容组件添加到您的设计
-
在可视设计空间中，使用现有模板或将所需的结构组件添加到空画布中以定义布局。
-
在 组件 库中，获取所选内容组件的拖动手柄
可以将多个组件添加到单个结构组件中，并添加到结构组件的每一列中。
-
使用右侧的 设置 和 样式 选项卡或画布中显示的上下文工具栏调整组件显示。
例如，可以更改组件的文本样式、填充或边距。
内容组件设置和样式
添加组件后，将在可视设计空间中选择该组件，其属性将显示在右侧面板中。 您还可以随时选择组件以更改设置和样式。 许多设置和样式都是特定于组件的，但有一些标准设置和样式可应用到任何选定内容组件。
显示选项
如果要从桌面或移动设备显示中排除该组件，请更改 显示选项 设置。 默认值在所有设备上显示，允许在所有设备上显示。 选择其他设置以使组件按设备类型专用：
- 仅在桌面设备上显示 — 当您想要在桌面设备上显示组件并为移动设备排除该组件时，请选择此设置。
- 仅在移动设备上显示 — 如果要在移动设备（如手机和平板电脑）上显示组件，请选择此设置，并将其排除在桌面设备之外。
容器
使用容器将特定样式应用于一组内容组件。 添加Container组件，然后在其内部添加其他内容组件。 此组件类似于您在HTML中使用div元素的方式。 您可以对容器应用不同的样式，使其不同于对容器所包含的内容组件应用的样式。
例如，添加一个 Container 组件，然后在该容器中添加一个 Button 组件。 您可以为容器使用特定区域样式，并根据需要为按钮及其背景设置样式。
在右侧面板中选择 样式 选项卡后，使用 背景 部分定义组件的背景颜色。
选中复选框，然后单击颜色方框以从选取器中选择颜色。 您可以通过输入已知的RGB、HSL、HSB或十六进制值来选择颜色。 或者，可以使用颜色滑块和颜色域来选择颜色。
-
在选择了 样式 选项卡的右侧面板上，展开 边框 部分并设置相应选项以显示组件的边框：
-
将切换开关右移以启用边框显示选项，并根据您的设计标准进行设置：
- 若要设置边框颜色，请选中该复选框，然后单击颜色正方形以从选取器中选择颜色。 您可以通过输入已知的RGB、HSL、HSB或十六进制值来选择颜色。 或者，可以使用颜色滑块和颜色域来选择颜色。
-
要设置边框大小 （线条宽度），请单击向上和向下箭头图标以增加或减少像素数。
-
若要设置边框样式，请从标准CSS
border-style值列表中选择一个值。 -
要确定显示边框的位置，请选中每个 边框位置 复选框。
-
对于边框半径，根据您想要的拐角曲线设置数值。
值为0（默认）会产生一个方形角。
在选择了 样式 选项卡的右侧面板上，展开 大小 部分并设置组件高度和宽度的选项：
-
高度 — 单击向上和向下箭头图标以增加或减少像素数。 缺省值为空值(Auto)，并根据元素的内容调整元素的高度。
-
宽度 — 使用切换开关以像素或百分比设置宽度。
-
对于百分比宽度，使用滑块设置百分比值。 百分比根据包含块的内容框确定元素大小，其中不包括填充和边框。 例如，如果值为50，则将元素宽度设置为其包含的块内容宽度的50%。
使用百分比的
-
对于基于像素的宽度，单击向上和向下箭头图标可增加或减少像素数。 缺省值为空值(Auto)，并根据元素的内容调整元素宽度。
-
在选择了 样式 选项卡的右侧面板上，展开 边距 部分并设置结构组件中的边距间距选项。 此样式复制CSS margin参数，该参数控制组件边框之外的空间，将其与其他组件分开。 它会在组件周围创建一个间隙，以影响其定位和周围内容的布局。
根据设计需要设置边距值（像素）。 您可以单独设置组件的所有边、上边框、左右边或每侧的边距：
-
所有边 — 若要设置一个值以应用于所有边，请清除每个边的 不同边距 复选框。 单击向上和向下箭头图标以增加或减少像素数。
-
上下 — 若要将上边距和下边距设置为相同的值，请设置上设置和下设置之间的 锁定 图标。 单击的向上和向下箭头图标可增加或减少像素数。
-
左右边距 — 若要将左右边距设置为相同的值，请设置左右设置之间的 锁定 图标。 单击的向上和向下箭头图标可增加或减少像素数。
-
独立 — 若要将每个边距设置为独立值，请在上下设置之间以及左右设置之间设置 Unlocked 图标。 对于每个设置，单击向上和向下箭头图标以增加或减少像素数。
在选择了 样式 选项卡的右侧面板上，展开 内边距 部分，并设置结构组件内的内边距选项。 此样式将复制CSS padding参数，该参数是组件内容与其边框之间的空间。 内边距提供了内部间距，可用于控制内容与组件边框之间的距离。
根据设计需要设置以像素为单位的填充值。 您可以单独设置组件的所有边、上边框、左右边或每侧的边距：
-
所有边 — 若要设置一个值以应用于所有边，请清除 每个边的不同边距 复选框。 单击向上和向下箭头图标以增加或减少像素数。
-
Top-bottom — 若要将顶边距和底边距设置为相同的值，请将 Locked 图标设置为介于顶设置和底设置之间。 单击的向上和向下箭头图标可增加或减少像素数。
-
左右边距 — 若要将左右边距设置为相同的值，请设置左右设置之间的 锁定 图标。 单击的向上和向下箭头图标可增加或减少像素数。
-
独立 — 若要将每侧的填充设置为独立值，请在顶部设置与底部设置之间以及左侧设置与右侧设置之间设置 已解锁 图标。 对于每个设置，单击向上和向下箭头图标以增加或减少像素数。
按钮
使用Button组件在内容中插入一个或多个可单击按钮。 使用按钮将页面查看者或电子邮件收件人重定向到支持内容（已发布的登陆页面或外部链接）。
添加按钮文本
在画布中显示按钮组件时，工具栏包含文本格式设置选项以及个性化和条件变体。 有关编辑器工具栏选项的更多信息，请参见#。
在输入按钮标签文本并设置格式时，按钮会调整大小以适应内容。
与工具栏一起显示的
设置链接选项
在 设置 选项卡上，使用 链接 选项定义按钮文本、链接目标以及用于加载目标页面的浏览器行为。
-
为链接设置类型：
-
外部链接 — 选择此类型以使用标准URL作为链接目标。
在 Url 中，输入链接目标的URL。 单击个性化 （
-
登陆页面 — 选择此类型可在连接的Marketo Engage实例中选择已发布的登陆页面。
对于 登陆页面 选项，选择已发布的登陆页面。 单击 选择页面 图标（
-
-
对于标签，输入要显示在按钮中的文本。
按钮大小会根据设置的文本和样式进行调整。
-
对于Target，请选择如何从电子邮件或页面重定向链接的目标：
- 无 — 使用默认浏览器或客户端行为（默认）打开链接。
- 空白 — 在新窗口或选项卡中打开链接。
- Self — 在同一帧中打开链接。
- 父项 — 在父框架中打开链接。
- Top — 在窗口的整个正文中打开链接。
设置样式
在 样式 选项卡中自定义按钮样式。
在右侧面板中选择 样式 选项卡后，使用 背景 部分定义组件的背景颜色。
选中复选框，然后单击颜色方框以从选取器中选择颜色。 您可以通过输入已知的RGB、HSL、HSB或十六进制值来选择颜色。 或者，可以使用颜色滑块和颜色域来选择颜色。
在选择了 样式 选项卡的右侧面板上，展开 文本 部分并设置组件文本样式的选项：
-
字体系列 — 单击向下箭头图标，为组件中的文本选择字体系列。
-
字体大小 — 单击向上和向下箭头图标以增加或减小字体大小，或输入值。 对于输入的值，可以使用小数。
-
行高 — 单击向上和向下箭头图标以增加或减少行高，或输入值。 对于输入的值，可以使用小数。
-
文本样式 — 选择文本样式的图标： 粗体、斜体、下划线或删除线。
-
文本对齐方式 — 选择水平文本对齐方式的图标： 左、居中、右或两端对齐。
-
字体颜色 — 单击颜色正方形以从选取器中选择字体颜色。 您可以通过输入已知的RGB、HSL、HSB或十六进制值来选择颜色。 或者，可以使用颜色滑块和颜色域来选择颜色。
-
在选择了 样式 选项卡的右侧面板上，展开 边框 部分并设置相应选项以显示组件的边框：
-
将切换开关右移以启用边框显示选项，并根据您的设计标准进行设置：
- 若要设置边框颜色，请选中该复选框，然后单击颜色正方形以从选取器中选择颜色。 您可以通过输入已知的RGB、HSL、HSB或十六进制值来选择颜色。 或者，可以使用颜色滑块和颜色域来选择颜色。
-
要设置边框大小 （线条宽度），请单击向上和向下箭头图标以增加或减少像素数。
-
若要设置边框样式，请从标准CSS
border-style值列表中选择一个值。 -
要确定显示边框的位置，请选中每个 边框位置 复选框。
-
对于边框半径，根据您想要的拐角曲线设置数值。
值为0（默认）会产生一个方形角。
在选择了 样式 选项卡的右侧面板上，展开 大小 部分并设置组件高度和宽度的选项：
-
高度 — 单击向上和向下箭头图标以增加或减少像素数。 缺省值为空值(Auto)，并根据元素的内容调整元素的高度。
-
宽度 — 使用切换开关以像素或百分比设置宽度。
-
对于百分比宽度，使用滑块设置百分比值。 百分比根据包含块的内容框确定元素大小，其中不包括填充和边框。 例如，如果值为50，则将元素宽度设置为其包含的块内容宽度的50%。
使用百分比的
-
对于基于像素的宽度，单击向上和向下箭头图标可增加或减少像素数。 缺省值为空值(Auto)，并根据元素的内容调整元素宽度。
-
+++对齐方式
+++
+++按钮边距
+++
在选择了 样式 选项卡的右侧面板上，展开 边距 部分并设置结构组件中的边距间距选项。 此样式复制CSS margin参数，该参数控制组件边框之外的空间，将其与其他组件分开。 它会在组件周围创建一个间隙，以影响其定位和周围内容的布局。
根据设计需要设置边距值（像素）。 您可以单独设置组件的所有边、上边框、左右边或每侧的边距：
-
所有边 — 若要设置一个值以应用于所有边，请清除每个边的 不同边距 复选框。 单击向上和向下箭头图标以增加或减少像素数。
-
上下 — 若要将上边距和下边距设置为相同的值，请设置上设置和下设置之间的 锁定 图标。 单击的向上和向下箭头图标可增加或减少像素数。
-
左右边距 — 若要将左右边距设置为相同的值，请设置左右设置之间的 锁定 图标。 单击的向上和向下箭头图标可增加或减少像素数。
-
独立 — 若要将每个边距设置为独立值，请在上下设置之间以及左右设置之间设置 Unlocked 图标。 对于每个设置，单击向上和向下箭头图标以增加或减少像素数。
在选择了 样式 选项卡的右侧面板上，展开 内边距 部分，并设置结构组件内的内边距选项。 此样式将复制CSS padding参数，该参数是组件内容与其边框之间的空间。 内边距提供了内部间距，可用于控制内容与组件边框之间的距离。
根据设计需要设置以像素为单位的填充值。 您可以单独设置组件的所有边、上边框、左右边或每侧的边距：
-
所有边 — 若要设置一个值以应用于所有边，请清除 每个边的不同边距 复选框。 单击向上和向下箭头图标以增加或减少像素数。
-
Top-bottom — 若要将顶边距和底边距设置为相同的值，请将 Locked 图标设置为介于顶设置和底设置之间。 单击的向上和向下箭头图标可增加或减少像素数。
-
左右边距 — 若要将左右边距设置为相同的值，请设置左右设置之间的 锁定 图标。 单击的向上和向下箭头图标可增加或减少像素数。
-
独立 — 若要将每侧的填充设置为独立值，请在顶部设置与底部设置之间以及左侧设置与右侧设置之间设置 已解锁 图标。 对于每个设置，单击向上和向下箭头图标以增加或减少像素数。
若要使用值应用其他符合CSS的属性，请使用 高级 样式设置。 您可以更改现有属性的值或添加新属性。 样式使用父 — 子组件（元素）的CSS继承模型应用于组件。
显示的属性反映当前为组件定义的样式。 您可以根据CSS定义更改值。 单击添加 (+)图标为组件添加新的样式属性。
文本
使用文本组件在内容中插入文本块。 在画布中选择文本组件后，输入文本并使用工具栏选项添加内联格式和选项，包括个性化令牌和条件变体。
在 样式 选项卡中自定义文本组件样式。
在右侧面板中选择 样式 选项卡后，使用 背景 部分定义组件的背景颜色。
选中复选框，然后单击颜色方框以从选取器中选择颜色。 您可以通过输入已知的RGB、HSL、HSB或十六进制值来选择颜色。 或者，可以使用颜色滑块和颜色域来选择颜色。
这些样式将应用于整个文本块。 可以将内联样式应用于所选文本字符串。
在选择了 样式 选项卡的右侧面板上，展开 文本 部分并设置组件文本样式的选项：
-
字体系列 — 单击向下箭头图标，为组件中的文本选择字体系列。
-
字体大小 — 单击向上和向下箭头图标以增加或减小字体大小，或输入值。 对于输入的值，可以使用小数。
-
行高 — 单击向上和向下箭头图标以增加或减少行高，或输入值。 对于输入的值，可以使用小数。
-
文本样式 — 选择文本样式的图标： 粗体、斜体、下划线或删除线。
-
文本对齐方式 — 选择水平文本对齐方式的图标： 左、居中、右或两端对齐。
-
字体颜色 — 单击颜色正方形以从选取器中选择字体颜色。 您可以通过输入已知的RGB、HSL、HSB或十六进制值来选择颜色。 或者，可以使用颜色滑块和颜色域来选择颜色。
-
在选择了 样式 选项卡的右侧面板上，展开 边框 部分并设置相应选项以显示组件的边框：
-
将切换开关右移以启用边框显示选项，并根据您的设计标准进行设置：
- 若要设置边框颜色，请选中该复选框，然后单击颜色正方形以从选取器中选择颜色。 您可以通过输入已知的RGB、HSL、HSB或十六进制值来选择颜色。 或者，可以使用颜色滑块和颜色域来选择颜色。
-
要设置边框大小 （线条宽度），请单击向上和向下箭头图标以增加或减少像素数。
-
若要设置边框样式，请从标准CSS
border-style值列表中选择一个值。 -
要确定显示边框的位置，请选中每个 边框位置 复选框。
-
对于边框半径，根据您想要的拐角曲线设置数值。
值为0（默认）会产生一个方形角。
在选择了 样式 选项卡的右侧面板上，展开 大小 部分并设置组件高度和宽度的选项：
-
高度 — 单击向上和向下箭头图标以增加或减少像素数。 缺省值为空值(Auto)，并根据元素的内容调整元素的高度。
-
宽度 — 使用切换开关以像素或百分比设置宽度。
-
对于百分比宽度，使用滑块设置百分比值。 百分比根据包含块的内容框确定元素大小，其中不包括填充和边框。 例如，如果值为50，则将元素宽度设置为其包含的块内容宽度的50%。
使用百分比的
-
对于基于像素的宽度，单击向上和向下箭头图标可增加或减少像素数。 缺省值为空值(Auto)，并根据元素的内容调整元素宽度。
-
在选择了 样式 选项卡的右侧面板上，展开 边距 部分并设置结构组件中的边距间距选项。 此样式复制CSS margin参数，该参数控制组件边框之外的空间，将其与其他组件分开。 它会在组件周围创建一个间隙，以影响其定位和周围内容的布局。
根据设计需要设置边距值（像素）。 您可以单独设置组件的所有边、上边框、左右边或每侧的边距：
-
所有边 — 若要设置一个值以应用于所有边，请清除每个边的 不同边距 复选框。 单击向上和向下箭头图标以增加或减少像素数。
-
上下 — 若要将上边距和下边距设置为相同的值，请设置上设置和下设置之间的 锁定 图标。 单击的向上和向下箭头图标可增加或减少像素数。
-
左右边距 — 若要将左右边距设置为相同的值，请设置左右设置之间的 锁定 图标。 单击的向上和向下箭头图标可增加或减少像素数。
-
独立 — 若要将每个边距设置为独立值，请在上下设置之间以及左右设置之间设置 Unlocked 图标。 对于每个设置，单击向上和向下箭头图标以增加或减少像素数。
在选择了 样式 选项卡的右侧面板上，展开 内边距 部分，并设置结构组件内的内边距选项。 此样式将复制CSS padding参数，该参数是组件内容与其边框之间的空间。 内边距提供了内部间距，可用于控制内容与组件边框之间的距离。
根据设计需要设置以像素为单位的填充值。 您可以单独设置组件的所有边、上边框、左右边或每侧的边距：
-
所有边 — 若要设置一个值以应用于所有边，请清除 每个边的不同边距 复选框。 单击向上和向下箭头图标以增加或减少像素数。
-
Top-bottom — 若要将顶边距和底边距设置为相同的值，请将 Locked 图标设置为介于顶设置和底设置之间。 单击的向上和向下箭头图标可增加或减少像素数。
-
左右边距 — 若要将左右边距设置为相同的值，请设置左右设置之间的 锁定 图标。 单击的向上和向下箭头图标可增加或减少像素数。
-
独立 — 若要将每侧的填充设置为独立值，请在顶部设置与底部设置之间以及左侧设置与右侧设置之间设置 已解锁 图标。 对于每个设置，单击向上和向下箭头图标以增加或减少像素数。
若要使用值应用其他符合CSS的属性，请使用 高级 样式设置。 您可以更改现有属性的值或添加新属性。 样式使用父 — 子组件（元素）的CSS继承模型应用于组件。
显示的属性反映当前为组件定义的样式。 您可以根据CSS定义更改值。 单击添加 (+)图标为组件添加新的样式属性。
分隔条
添加 分隔线 组件以在内容的不同部分之间合并线性分隔。
在右侧面板中选择 样式 选项卡后，使用 背景 部分定义组件的背景颜色。
选中复选框，然后单击颜色方框以从选取器中选择颜色。 您可以通过输入已知的RGB、HSL、HSB或十六进制值来选择颜色。 或者，可以使用颜色滑块和颜色域来选择颜色。
+++线形图
+++
在选择了 样式 选项卡的右侧面板上，展开 大小 部分并设置组件高度和宽度的选项：
-
高度 — 单击向上和向下箭头图标以增加或减少像素数。 缺省值为空值(Auto)，并根据元素的内容调整元素的高度。
-
宽度 — 使用切换开关以像素或百分比设置宽度。
-
对于百分比宽度，使用滑块设置百分比值。 百分比根据包含块的内容框确定元素大小，其中不包括填充和边框。 例如，如果值为50，则将元素宽度设置为其包含的块内容宽度的50%。
使用百分比的
-
对于基于像素的宽度，单击向上和向下箭头图标可增加或减少像素数。 缺省值为空值(Auto)，并根据元素的内容调整元素宽度。
-
展开 对齐方式 部分，然后选择要使用的水平对齐方式：左对齐、居中对齐或右对齐。 此样式将转换为标准text-align CSS样式，并影响该组件在容器组件中的放置方式。
在选择了 样式 选项卡的右侧面板上，展开 边距 部分并设置结构组件中的边距间距选项。 此样式复制CSS margin参数，该参数控制组件边框之外的空间，将其与其他组件分开。 它会在组件周围创建一个间隙，以影响其定位和周围内容的布局。
根据设计需要设置边距值（像素）。 您可以单独设置组件的所有边、上边框、左右边或每侧的边距：
-
所有边 — 若要设置一个值以应用于所有边，请清除每个边的 不同边距 复选框。 单击向上和向下箭头图标以增加或减少像素数。
-
上下 — 若要将上边距和下边距设置为相同的值，请设置上设置和下设置之间的 锁定 图标。 单击的向上和向下箭头图标可增加或减少像素数。
-
左右边距 — 若要将左右边距设置为相同的值，请设置左右设置之间的 锁定 图标。 单击的向上和向下箭头图标可增加或减少像素数。
-
独立 — 若要将每个边距设置为独立值，请在上下设置之间以及左右设置之间设置 Unlocked 图标。 对于每个设置，单击向上和向下箭头图标以增加或减少像素数。
在选择了 样式 选项卡的右侧面板上，展开 内边距 部分，并设置结构组件内的内边距选项。 此样式将复制CSS padding参数，该参数是组件内容与其边框之间的空间。 内边距提供了内部间距，可用于控制内容与组件边框之间的距离。
根据设计需要设置以像素为单位的填充值。 您可以单独设置组件的所有边、上边框、左右边或每侧的边距：
-
所有边 — 若要设置一个值以应用于所有边，请清除 每个边的不同边距 复选框。 单击向上和向下箭头图标以增加或减少像素数。
-
Top-bottom — 若要将顶边距和底边距设置为相同的值，请将 Locked 图标设置为介于顶设置和底设置之间。 单击的向上和向下箭头图标可增加或减少像素数。
-
左右边距 — 若要将左右边距设置为相同的值，请设置左右设置之间的 锁定 图标。 单击的向上和向下箭头图标可增加或减少像素数。
-
独立 — 若要将每侧的填充设置为独立值，请在顶部设置与底部设置之间以及左侧设置与右侧设置之间设置 已解锁 图标。 对于每个设置，单击向上和向下箭头图标以增加或减少像素数。
若要使用值应用其他符合CSS的属性，请使用 高级 样式设置。 您可以更改现有属性的值或添加新属性。 样式使用父 — 子组件（元素）的CSS继承模型应用于组件。
显示的属性反映当前为组件定义的样式。 您可以根据CSS定义更改值。 单击添加 (+)图标为组件添加新的样式属性。
HTML
使用HTML组件可添加部分现有HTML。 此组件提供了一种轻松创建可重复使用外部内容的模块化HTML元素的方法。
-
在画布上选择组件，然后单击工具栏中的 显示源代码 图标。
-
将HTML粘贴到文本框中，然后单击保存。
如果HTML有效，它会在画布上呈现元素。 如果它是一个映射到其他内容组件的元素，则可以根据组件类型更改右侧面板中的设置和样式。 如果不包含，它仍会作为HTML组件存在。
对于HTML组件，您可以在右侧面板中为整个HTML组件设置以下样式：
在右侧面板中选择 样式 选项卡后，使用 背景 部分定义组件的背景颜色。
选中复选框，然后单击颜色方框以从选取器中选择颜色。 您可以通过输入已知的RGB、HSL、HSB或十六进制值来选择颜色。 或者，可以使用颜色滑块和颜色域来选择颜色。
-
在选择了 样式 选项卡的右侧面板上，展开 边框 部分并设置相应选项以显示组件的边框：
-
将切换开关右移以启用边框显示选项，并根据您的设计标准进行设置：
- 若要设置边框颜色，请选中该复选框，然后单击颜色正方形以从选取器中选择颜色。 您可以通过输入已知的RGB、HSL、HSB或十六进制值来选择颜色。 或者，可以使用颜色滑块和颜色域来选择颜色。
-
要设置边框大小 （线条宽度），请单击向上和向下箭头图标以增加或减少像素数。
-
若要设置边框样式，请从标准CSS
border-style值列表中选择一个值。 -
要确定显示边框的位置，请选中每个 边框位置 复选框。
-
对于边框半径，根据您想要的拐角曲线设置数值。
值为0（默认）会产生一个方形角。
在选择了 样式 选项卡的右侧面板上，展开 大小 部分并设置组件高度和宽度的选项：
-
高度 — 单击向上和向下箭头图标以增加或减少像素数。 缺省值为空值(Auto)，并根据元素的内容调整元素的高度。
-
宽度 — 使用切换开关以像素或百分比设置宽度。
-
对于百分比宽度，使用滑块设置百分比值。 百分比根据包含块的内容框确定元素大小，其中不包括填充和边框。 例如，如果值为50，则将元素宽度设置为其包含的块内容宽度的50%。
使用百分比的
-
对于基于像素的宽度，单击向上和向下箭头图标可增加或减少像素数。 缺省值为空值(Auto)，并根据元素的内容调整元素宽度。
-
展开 对齐方式 部分，然后选择要使用的水平和垂直对齐方式。 对齐样式会影响HTML组件在容器组件（结构或容器）中的放置方式。
水平对齐方式将转换为标准text-align CSS样式，您可以从左、中或右进行选择。 垂直对齐将转换为标准vertical-align CSS样式，您可以从顶部、中间或底部进行选择。
HTML组件的
在选择了 样式 选项卡的右侧面板上，展开 边距 部分并设置结构组件中的边距间距选项。 此样式复制CSS margin参数，该参数控制组件边框之外的空间，将其与其他组件分开。 它会在组件周围创建一个间隙，以影响其定位和周围内容的布局。
根据设计需要设置边距值（像素）。 您可以单独设置组件的所有边、上边框、左右边或每侧的边距：
-
所有边 — 若要设置一个值以应用于所有边，请清除每个边的 不同边距 复选框。 单击向上和向下箭头图标以增加或减少像素数。
-
上下 — 若要将上边距和下边距设置为相同的值，请设置上设置和下设置之间的 锁定 图标。 单击的向上和向下箭头图标可增加或减少像素数。
-
左右边距 — 若要将左右边距设置为相同的值，请设置左右设置之间的 锁定 图标。 单击的向上和向下箭头图标可增加或减少像素数。
-
独立 — 若要将每个边距设置为独立值，请在上下设置之间以及左右设置之间设置 Unlocked 图标。 对于每个设置，单击向上和向下箭头图标以增加或减少像素数。
在选择了 样式 选项卡的右侧面板上，展开 内边距 部分，并设置结构组件内的内边距选项。 此样式将复制CSS padding参数，该参数是组件内容与其边框之间的空间。 内边距提供了内部间距，可用于控制内容与组件边框之间的距离。
根据设计需要设置以像素为单位的填充值。 您可以单独设置组件的所有边、上边框、左右边或每侧的边距：
-
所有边 — 若要设置一个值以应用于所有边，请清除 每个边的不同边距 复选框。 单击向上和向下箭头图标以增加或减少像素数。
-
Top-bottom — 若要将顶边距和底边距设置为相同的值，请将 Locked 图标设置为介于顶设置和底设置之间。 单击的向上和向下箭头图标可增加或减少像素数。
-
左右边距 — 若要将左右边距设置为相同的值，请设置左右设置之间的 锁定 图标。 单击的向上和向下箭头图标可增加或减少像素数。
-
独立 — 若要将每侧的填充设置为独立值，请在顶部设置与底部设置之间以及左侧设置与右侧设置之间设置 已解锁 图标。 对于每个设置，单击向上和向下箭头图标以增加或减少像素数。
若要使用值应用其他符合CSS的属性，请使用 高级 样式设置。 您可以更改现有属性的值或添加新属性。 样式使用父 — 子组件（元素）的CSS继承模型应用于组件。
显示的属性反映当前为组件定义的样式。 您可以根据CSS定义更改值。 单击添加 (+)图标为组件添加新的样式属性。
图像
使用图像组件将图像资源插入到您的内容中。 在画布中选择 图像 组件后，您可以添加或更改显示的图像资源文件。
添加图像资源
选择资源源类型并选择图像文件：