# HTML

来源快照：`result_data_new_260518.json`

- 来源 ID：`1183668780501770273`
- 模块：低代码平台e-builder
- 目录：页面引擎 - 页面设计器 - 页面组件 - 基础组件 - 基础组件/基础类
- space ID：`1157961794811633670`
- 原文链接：未提供
- 产品基线：未提供

## 正文

## 一、功能背景及价值用途

在低代码平台中，HTML组件是用于输入、编辑和展示多行文本内容的基础控件。它支持用户灵活录入大段文字信息（如描述、说明、备注等），并可通过样式配置适配不同场景的排版需求。支持字体、颜色、对齐等基础样式设置，提升内容可读性。可关联数据变量或接口，实现文本内容的动态渲染与更新，助力用户高效完成内容管理与展示。

## 二、功能概述及使用说明

1、

### 组件适用范围

【适用终端范围】：电脑端、手机端

【适用模块范围】：e-Builder与门户免登录组件与BI

【适用布局范围】：网格布局、流式布局

【适用租户范围】：all_teams（可以在所有租户中使用）

2、

### 组件位置

基础组件-基础类-HTML，如下图1所示

![](https://weapp.eteams.cn/papi/file/preview?fileId=1160544590711291981&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

（图1）

3、

### 组件配置项

3.1 属性，如下图2所示

![](https://weapp.eteams.cn/papi/file/preview?fileId=1160544869743656980&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

（图2）

3.1.1 ①【内容】：默认值为空，内容部分主要由富文本组件构成，包含【字体】、【大小】、【文本颜色】、【背景颜色】、【加粗】、【倾斜】、【左对齐】、【居中】、【右对齐】、【两端对齐】、【图片插件】、【全屏】、【系统参数】、【显示转换】、【多语言】等配置；其中富文本基础配置不再过多描述，进把一些自定义插件简单说明下用途

![](https://weapp.eteams.cn/papi/file/preview?fileId=1160544921350373409&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

（图3）

【图片插件】：点击上图3的①位置图标，弹出【图片素材库】弹窗，可选择指定图片到文本组件内，如下图4所示；【素材库】帮助文档：

![](https://weapp.eteams.cn/papi/file/preview?fileId=1160544740877860897&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

（图4）

【系统参数】：点击上图3的②位置图标，弹出【系统参数】弹层，可选择相关系统变量，运行页面会解析变量值显示，如下图5所示；【系统参数】帮助文档：

![](https://weapp.eteams.cn/papi/file/preview?fileId=1160544337347133599&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

（图5）

【显示转换】：选中文本组件内容里数据集变量后，点击上图3的③位置图标，弹出【显示转换】弹层，可配置相关显示转换效果，如下图6所示；【显示转换】帮助文档：

![](https://weapp.eteams.cn/papi/file/preview?fileId=1160544930054824028&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

(图6)

【多语言】：点击上图3的④图标，弹出【插入多语言标签】弹窗，可选中多语言标签在文本组件内显示，如下图7所示；【多语言】帮助文档：

![](https://weapp.eteams.cn/papi/file/preview?fileId=1160544586300981259&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

（图7）

当页面上配置有数据集时，可在HTML组件内键入#唤起数据集的快捷选择，如下图8所示；

![](https://weapp.eteams.cn/papi/file/preview?fileId=1160544320177856514&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

（图8）

## 三、上下游关联功能点

1、[组件样式](https://weapp.eteams.cn/sp/ebdpage/view/freepass/1152863419640021002?freepass_doc=1&id=1159212708506116122&space_id=1157961794811633670 "组件样式")

2、[组件事件动作](https://weapp.eteams.cn/sp/ebdpage/view/freepass/1152863419640021002?freepass_doc=1&id=1159192088358584536&space_id=1157961794811633670 "组件事件动作")

3、[组件权限](https://weapp.eteams.cn/sp/ebdpage/view/freepass/1152863419640021002?freepass_doc=1&id=1159789964944113758&space_id=1157961794811633670 "组件权限")
