> ## Documentation Index
> Fetch the complete documentation index at: https://help.dingtalk.io/llms.txt
> Use this file to discover all available pages before exploring further.

# 图文展示

> 一种高级文本组件，适用于商品展示、报销、企业文化等场景。支持设置高级内容如自定义文案、样式、上传图片等功能，并提供Mobile端设置包括左右间距大小及页面折叠相关设置。

<Warning>
  注意：当前图文展示图片的图片，不支持在「免登模式」下访问。如果您需要在分享的地址内来实现的话，需要您先上传到您的其他图床中。该功能，也在宜搭的产品迭代排期内，敬请关注。
</Warning>

## 1. 简介

### 1.1 组件介绍

一种高级文本组件，可对文本样式进行独立设置。

### 1.2 适用场景

比如商品展示、报销、企业文化等场景，可使用该组件。

## 2. 基础功能

### 2.1 设置高级内容

点击设置高级内容，会进入到富文本编辑器，编辑器同[**富文本组件**](/zh/yida/form/hdi3ya)一样与钉钉文档编辑器保持一致，可以自定义文案、样式、上传图片等等。

<Frame>
  ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1639116105278-d9acafb2-6c4b-4f32-b30f-094162ade28e.png)
</Frame>

设置文本内容

<Frame>
  ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1647325178279-1cbbcba0-7417-4b38-a7ed-55bec80ae871.png)
</Frame>

### 2.2 Mobile 端设置

#### 2.2.1 设置左右间距的大小

<Frame>
  ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1639116617077-80b3049f-4ceb-41bc-891a-492230acce97.png)
</Frame>

* 无间距

<Frame>
  ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1618479110606-d078708c-305c-4730-9d5d-8e5cd29e7060.png)
</Frame>

* 16px

<Frame>
  ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1618479075021-f44aff80-9489-4ccd-a390-daea4eb699e6.png)
</Frame>

#### 2.2.2 页面折叠的相关设置

* 是否折叠: 当配置最大高度时是否可折叠收起
* 折叠高度: 超过高度, 可支持折叠
* 初始折叠: 初始化(打开页面)是否折叠

<Frame>
  ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1639116892722-3dac7b14-2bee-4c43-9e84-02602b835594.png)
</Frame>

**示例**：参考上图中的设置，手机端点击页面进去就是折叠收起的，可以点击下拉按钮展开完整页面

效果如图：

<Frame>
  ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1618479658311-73e51752-0267-4716-9caf-f3c4a9bd6099.png)
</Frame>

#### 2.3 样式设置

可以对整个页面进行页面展示设置，比如边距等

<Frame>
  ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1639116972886-db57988f-ce54-4526-8d83-297d1dc42872.png)
</Frame>

设置样式

**注意：图文展示比较特殊，因为里面是富文本，建议更多的文字相关的样式，都在富文本编辑器里编辑，样式设计器里的样式设置的部分属性，优先级不及富文本编辑器里的样式配置（如文字大小、颜色等等）**

参考: [**样式介绍**](/zh/yida/form/gdnsgw)