项目清单

GemPages 中的项目列表元素是什么？

项目列表元素允许您以列表形式呈现信息，每个项目都以一个图标开头。您可以从 GemPages 图标库中选择图标以保持视觉一致性，或者，如果您更喜欢自定义图标或图像，请使用 高级列表元素 代替。

此元素非常适合：

• 突出产品特色
• 列出福利或服务点
• 呈现逐步流程
• 创建紧凑、可扫描的内容

如何将项目列表元素添加到页面

要将项目列表元素添加到您的页面，请按照以下步骤操作：

第三步：   从你的 GemPages 仪表板，选择要编辑的页面并在编辑器中打开它。

第三步：  在编辑器中，转到左侧边栏中的内容列表部分或在搜索栏中搜索“项目列表”。

第三步： 将项目列表元素拖放到页面上所需的位置.

配置项目元素设置

将元素添加到页面上后，点击它。左侧边栏将显示两个主要选项卡： 个人设置 以及 先进的:

设置标签

1. 物品管理

此部分允许您添加、删除或重新排序列表项：

• 添加项目：将鼠标悬停在现有项目上，然后单击“复制”图标以创建精确副本。
• 移除项目：单击要删除的项目上的垃圾桶图标，然后确认。
• 重新排序项目将鼠标悬停在要移动的物品上， 点击并按住鼠标， 然后 向上或向下拖动 更改其在列表中的位置。当项目位于所需顺序时，松开鼠标。

2.图标

• 图标类型：项目列表中每个项目的图标类型。有 2 种图标类型选项：

匹配图标：项目列表中的所有图标都将相同。

不同的图标：项目列表中的每个项目都有单独的图标。

• 图标来源：选择显示的图标

如果图标类型 = 匹配图标：项目列表中的所有图标都将相同。

如果图标类型 = 不同的图标：项目列表中的每个项目都有一个单独的图标。

用户手动选择每个项目的每个图标。

• 图标大小: 输入您喜欢的图标大小。默认图标大小为16px。

• 图标颜色: 从调色板中选择图标的颜色或在框中输入颜色十六进制代码.

• 职务：列表中每一项中图标相对于文本的位置。位置选项有 2 个：顶部对齐、居中对齐。

• 填充：调整图标容器内的空间。这可以控制图标与其容器边缘的距离。增加内边距可为图标提供更多空间；减少内边距可使其更紧密贴合。

• 背景: 在图标后面添加背景。

颜色： 选择纯色或渐变背景颜色。

图片： 上传一张图片以显示在图标后面。

• 边境: 在图标容器周围添加边框。您可以设置：

边框样式（实线、虚线、点线）

边框粗细（以像素为单位）

边框颜色

• 角落：通过设置边框半径来调整图标容器角的圆度。

3. 文本样式

此时，您可以编辑文本的排版。以下是可用选项：

• 样式：从预定义选项中选择您想要的样式，其中包括 6 种标题样式和 3 种段落样式。
• 字体：选择您想要使用的文本字体。如果您想使用未列出的字体，您可以参考提供的指导 如何在 Editor ver 7 中添加自定义字体.
• 尺寸：通过指定像素值来调整字体大小。
• 颜色：根据您的喜好修改文本的颜色。

单击“显示更多”按钮以显示更多自定义选项：

• 字体粗细：从提供的下拉菜单中选择所需的字体粗细。
• 线高：通过指定百分比值调整文本的高度。
• 字母间距：通过输入像素值来修改字母之间的间距。
• 文本变换：以下列方式之一转换文本：不应用转换、大写、小写、大写。

4. 项目间距

使用滑块调整列表项之间的垂直间距。

默认值：12px。

5. 商品风格

图标和文本间隙——控制图标和文本之间的水平空间。

默认值：8px。

6。 背景

• 颜色：单击颜色选择器以选择纯色或渐变色背景。
  
• 图片：从您的设备上传背景图片。建议尺寸取决于您的设计布局。

7。 尺寸

• 宽度：输入数值（px）或选择：

适合内容：宽度与内容大小匹配。

完整：拉伸至整个容器宽度。

• 填充：调整内容和元素边框之间的内部间距。
• 安排： 将整个元素左对齐、居中或右对齐。

8。 形状

• 边境：添加边框，选择样式（实线、虚线、点线）、设置粗细和颜色。
• 角落：通过设置半径值来使角变圆（例如，5px 为轻微圆角，50px 为完全圆角）。
  
• 阴影：添加阴影效果以增加深度；调整模糊、扩散和颜色。

9.对齐

• 如果宽度 = 100%，则对齐是固定的，不能改变。
  
• 否则，默认对齐方式为左对齐，但您可以根据需要切换到居中或右对齐。

高级选项卡

如需进行高级自定义，请转到“高级”选项卡。在这里您可以：

• 添加自定义 CSS 以获得独特的样式。
• 控制每种设备类型的可见性。
• 应用动画和交互效果。

有关详细说明，请参阅我们的 高级设置 的文章。