---
order: 9
navTitle: HTML
---
# SuperPage组件-嵌入HTML
SuperPage提供了嵌入HTML组件，可以将来源不同的HTML嵌入到SuperPage中展示。如在SuperPage页面中嵌入一段自定义的HTML：
示例地址：[嵌入HTML](https://demo.succbi.com/v5/DEMO/app/ap.app?id=HTML)
## 使用嵌入HTML组件{#start}
使用嵌入HTML组件时，只需要在拖入HTML组件后，选择**HTML来源**并设置来源属性即可。如嵌入一段自定义的HTML，具体步骤如下：
1. **拖入HTML组件**：在**组件区**>**嵌入**分组下将HTML组件拖入到画布中
2. **设置HTML来源**：在**属性栏**>**数据**中，选择**HTML来源**为`HTML`，并点击**编辑HTML**按钮，在弹出的对话框中根据实际需求输入相应的HTML代码
## HTML来源{#source}
嵌入HTML组件的HTML来源除了可以自定义，还支持从模型数据中取字段值，以及引用已有的HTML文件，最终读取的都是一段HTML代码：
- **HTML**：默认选项，点击**编辑HTML**按钮可自定义HTML，通过在HTML中输入宏可实现与HTML的交互，如与[按钮组件](../common/button.md)搭配显示一个步进器
- **字段**：需要提前[引入数据模型](../../design/datasourse.md)，可通过指定存储HTML数据的**字段**来显示HTML页面
- **URL**：可通过[动态路径](./embeddatamodel.md#路径)的方式引用已有的HTML文件，支持输入宏及多种地址类型，如使用**应用绝对地址**：`SuperPage.app/控件/嵌入/URL嵌入HTML.html`，具体可参考[二维码内容设置](../more/qrcode.md#内容)