帮助中心
帮助中心 > 可视化组件
图文组件

功能介绍

  • 图文组件是一个非常常用且强大的功能,可以做出绝大部分图文展示效果,可以添加图片、文本、超链接等。

  • 常见的公司介绍、联系方式、产品优势等都可以使用图文组件来实现。


内容

1. 链接:图文组件支持本站链接、外部链接、电话号码和邮箱。

2. 灯箱效果:图文组件中的图片支持点击图片放大的灯箱效果,方便用户更清晰的浏览图片。

3. 布局:图文组件的布局支持网格和轮播和文字布局,以满足不同的布局需求。

4. 图片位置:图片和文字的搭配组合多达五种,轻松满足各种排版需求。

5. 覆盖效果:图片位置为覆盖时,此时可以设置覆盖效果,用户可以根据不同场景选择默认覆盖和悬停时覆盖两种效果。

6. 列数:选择不同列数来适应不同布局、不同设备。


样式

1. 图文栏:图文栏是一个抽象的概念,可以简单的把它认为下图包裹着图片、标题、描述的红框。

2. 背景颜色:统一调整图文栏的背景颜色,简单又方便。

3. 边框&圆角:你可以用这个功能迅速给你的图文栏添加不同样式的边框以及改变圆角。

4. 阴影:点击阴影编辑按钮调出阴影参数设置面板,通过设置参数来调整图文栏的阴影。

5. 内边距:当给图文栏设置了背景或者边框后,可以通过调整内边距的参数来统一控制图文栏里的内容到边框的距离,从而让整体的布局看起来更和谐。

6. 栏间距:通过拖动滑标或者输入数值来迅速的调整水平/垂直栏间距。

7. 状态:图文栏悬停状态支持整体的背景、边框、阴影以及图片和文本的变化,还支持丰富的悬停动画。需要注意的是,在图文栏里设置图片和文本的悬停状态是整体联动的,在图文和文本里单独设置悬停状态则是独立的(鼠标要放到图片/文本上才会有悬停效果)。

8. 悬停动画:即鼠标移到图文栏上时出现的动画效果。

9. 宽度:即图片的宽度,一般默认即可,但是特殊情况可能需要调整,比如小图标。

10. 文本:统一调整文本的各项参数。

11. 标题&描述:分别调整标题和描述的各项参数,并且可以单独设置标题/描述的显示行数以及向下的间距。

上一篇:轮播组件 下一篇:间隔组件