您可以在 Experience Builder 中更改每个微件的默认样式设置以自定义属性，例如大小、位置、背景、边框和框阴影。选项会有所不同，具体取决于您添加到的页面类型或其父容器（例如行或列）所施加的约束，这些约束会自动控制大小和位置。
样式设置
微件配置面板中的样式选项卡包含一些选项，可在配置 Web 体验时更改图标和标注以区分微件。连接微件时，图标和名称将显示在活动页面的轮廓视图和选择列表中。
可以为微件大小和位置设置明确的值，而不是在画布周围拖动微件来移动和调整其大小。大小和位置设置通过宽度、高度和位置来定义微件在页面上的位置。您可以以像素 (px) 或百分比 (%) 为单位指定这些值，以确定如何显示您的内容。有关适用于已添加到全屏页面或滚动页面的微件的大小和位置设置，请参阅以下部分。
所有微件通用的样式设置包括以下内容：
- 保留在父容器中 - 防止嵌套微件被拖动到其父微件的边界之外。
- 背景 - 通过选择填充颜色或图像来设置微件的背景。如果选择图像，则可以使用适合、填充、居中、平铺或拉伸将其放置在微件的边框内。如果选择适合，则该微件将在图像周围显示背景填充颜色。
- 边框 - 通过选择微件的颜色、样式（如虚线或点划线）和宽度（以像素为单位）来设置其边框。更改半径大小（按像素或百分比）以调整微件的角。锁定设置可同步所有四个角的半径。
- 框阴影 - 使用以下设置在微件周围添加阴影效果：
- 偏移 X - 设置阴影的水平距离。负值将阴影放置在微件的左侧，正值将阴影放置在微件的右侧。
- 偏移 Y - 设置阴影的垂直距离。负值将阴影放在微件上方，正值将阴影放在微件下方。
- 模糊半径 - 向阴影应用模糊效果。
- 传播半径 - 调整阴影的大小。
- 颜色 - 选择阴影颜色。
全屏页面布局
向应用程序添加全屏页面时，可以在自由布局中组织微件。如果在画布周围拖动微件以移动微件或调整其大小，则样式面板中的位置和大小设置会相应更新。
可设置以下位置设置：
- 左侧 - 指定微件左边相对于其父容器左边的右侧偏移的距离。
- 顶部 - 指定微件顶边在其父容器顶边下方偏移的距离。
- 右侧 - 指定微件右边相对于其父容器右边的左侧偏移的距离。
- 底部 - 指定微件底边在其父容器底边上方偏移的距离。
位置属性值不会同时全部生效。它们是两个设置的组合：
- 左侧和顶部或底部
- 右侧和顶部或底部
从自动切换至自定义来手动选择要定义的值。将位置值设置为自动后，该属性将自动进行设置。
注：
如果设置了顶部和底部的自定义值，则将使用顶部值。如果设置了左侧和右侧的自定义值，则当浏览器的语言是从左到右时（例如，英语或中文），将使用左侧值，当浏览器的语言是从右到左时（例如，希伯来语或阿拉伯语），将使用右侧值。
您还可以更改每个位置属性的单位：
- px - 以像素为单位的绝对值
- % - 容器宽度（左侧，右侧）和高度（顶部，底部）的百分比
大小设置是容器宽度和高度的组合。可以为宽度和高度设置特定值，也可以选择自动以使其自动进行设置。
要进行其他控制，请更改高度模式选项：
- 固定 - 分别设置宽度和高度。这是默认设置。
- 纵横比 - 仅设置宽度值和宽度与高度之间的纵横比。
示例
以下列表介绍了一些推荐的大小和位置设置组合：
- 对于自定义宽度，请设置自定义左侧或右侧值，然后为其他值选择自动。
- 对于自定义高度，请设置自定义顶部或底部值，然后为其他值选择自动。
- 如果宽度选择自动，则设置自定义左侧和右侧值；或者仅为左侧或右侧设置自定义值，然后使宽度适应微件内容。
- 如果高度选择自动，则设置自定义顶部和底部值；或者仅为顶部或底部设置自定义值，然后使高度适应微件内容。
滚动页面上的块
将滚动页面添加到应用程序时，将在块中组织其布局。块将使用与行微件中所用布局相似的多列格网布局。
块具有以下大小和位置设置：
- 宽度 - 按页面百分比设置固定宽度。
- 高度 - 以像素为单位设置高度值或选择自动以自动设置块高度。
- 偏移 X - 以像素为单位设置水平偏移。
- 偏移 Y - 以像素为单位设置垂直偏移。
嵌套在块中的微件
在块的格网布局中，添加到块的微件的宽度范围可为 1 到 12 列。您只能为嵌套在块中的微件指定高度值；其宽度由格网控制。如果将高度设置更改为自动，则将自动进行设置。
高度设置共有三种类型：
- 适应容器大小 - 使用其父容器的完整高度。这是默认设置。
- 固定 - 设置自定义高度（以像素为单位）。
- 纵横比 - 根据宽度和高度与宽度之间的纵横比自动计算高度。
如果选择固定或纵横比，则可以选择以下任一对齐选项：
- 顶部 - 将微件与块的顶部垂直对齐。
- 底部 - 将微件与块的底部垂直对齐。
- 居中 - 将微件与块的中心垂直对齐。