排版

HTML 标题标记
HTML 标记定义了默认的标题样式。

所有 H1 标题

标题 1

所有 H2 标题

标题 2

所有 H3 标题

标题 3

所有 H4 标题

标题 4

所有 H5 标题

标题 5

所有 H6 标题

标题 6

标题类
当排版风格与默认 HTML 标签不匹配时，可使用标题类。

heading-style-h1

标题样式-h1

heading-style-h2

标题样式-h2

heading-style-h3

标题样式-h3

heading-style-h4

标题样式-h4

heading-style-h5

标题样式-h5

heading-style-h6

标题样式-h6

其他 HTML 标签
HTML 标签定义默认文本样式。

所有段落

所有链接

所有街区语录

整块报价

所有无序列表

无项目表
无项目表

所有无序列表

无项目表
无项目表

所有有序列表

无项目表
无项目表
无项目表

文字大小
排版大小与默认 HTML 标签不匹配时的文字大小分类。

文字大小

文本大小-常规

文字大小

说明

文本权重
当排版权重与默认 HTML 标签不匹配时，可使用文本权重类别。

text-weight-xbold

text-weight-xbold (800)

text-weight-bold

text-weight-bold (700)

text-weight-semibold

text-weight-semibold (600)

text-weight-medium

text-weight-medium (500)

text-weight-normal

text-weight-normal (400)

text-weight-light

text-weight-light (300)

文本样式
当排版样式与默认 HTML 标签不匹配时，可使用文本样式类。

text-style-italic

text-style-strikethrough

text-style-allcaps

text-style-nowrap

文本-引号

text-style-link

text-style-2lines

text-style-3lines

Lorem ipsum dolor sit amet, consectetur adipiscing elit.Suspendisse varius enim in eros elementum tristique.Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.我的心在颤抖，我的身体在颤抖，我的心在颤抖，我的心在颤抖，我的心在颤抖。Nunc ut sem vitae risus tristique posuere.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Suspendisse varius enim in eros elementum tristique.Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.我的心在颤抖，我的身体在颤抖，我的心在颤抖，我的心在颤抖，我的心在颤抖。Nunc ut sem vitae risus tristique posuere.

text-style-muted

文本对齐方式
排版对齐方式与默认 HTML 标签不一致时的文本对齐方式类别。

文本左对齐

文本对齐居中

text-align-right

丰富文本

富文本

标题 1

标题 2

标题 3

标题 4

标题 5

标题 6

这是一段引文

富文本元素可让你在一个地方创建标题、段落、引文、图片和视频，并对其进行格式化，而不必逐一添加和格式化。只需双击即可轻松创建内容。

这是富文本中的一个链接

列表项目
列表项目
列表项目

列表项目
列表项目
列表项目

行业

什么是富文本元素？

富文本元素可让你在一个地方创建标题、段落、引文、图片和视频，并对其进行格式化，而不必逐一添加和格式化。只需双击即可轻松创建内容。

静态和动态内容编辑

富文本元素可用于静态或动态内容。对于静态内容，只需将其放入任何页面并开始编辑即可。对于动态内容，可在任何集合中添加富文本字段，然后在设置面板中将富文本元素连接到该字段。就可以了！

如何自定义每个富文本的格式

在使用 "When inside of "嵌套选择器系统为富文本元素添加类之后，标题、段落、块引号、数字、图像和数字标题都可以进行样式设置。

付款_rich-text

什么是富文本元素？

富文本元素可让你在一个地方创建标题、段落、引文、图片和视频，并对其进行格式化，而不必逐一添加和格式化。只需双击即可轻松创建内容。

静态和动态内容编辑

文本

‍

静态和动态内容编辑

如何自定义每个富文本的格式

在使用 "When inside of "嵌套选择器系统为富文本元素添加类之后，标题、段落、块引号、数字、图像和数字标题都可以进行样式设置。

颜色

背景颜色

bg-color-white

#fff

bg-color-Black

#000

bg-color-1

#889e77

bg-color-2

#9e7777

bg-color-3

#334350

bg-color-4

#f4f4f7

bg-color-5

#ebedee

bg-color-6

#E2E7EE

bg-color-7

#f1f2f4

文本颜色
管理重复出现的文本颜色。

text-color-1

这是 div 块中的一些文本。

文字颜色-2

这是 div 块中的一些文本。

文字颜色-3

这是 div 块中的一些文本。

文字颜色-4

这是 div 块中的一些文本。

效果

方框阴影
‍阴影可通过在 Z 轴上定位元素，为设计增加深度和真实感。

想了解如何以客户端优先的方式使用影子类吗？

影子-xx小

阴影-小号

影-小

中影

影-大

阴影-大

阴影-xxlarge

用户界面元素

按钮

联系销售人员

按钮

是二级

购卡

链接文本

链接

splide__arrows

左侧位置滑块箭头

splide__arrows

右置滑块箭头

splide__arrows

左上角位置滑块箭头

splide__arrows

左下角位置滑块箭头

splide__arrow

圆形滑块箭头

splide__arrow--prev

circle-slider-arrow-prev

splide__arrow--next

circle-slider-arrow-next

splide__pagination__page

圆点

splide__pagination__page

圆点

是活动

splide__pagination__page

圆点

splide__pagination__page

圆点

是活动

splide__arrow

circle-slider-arrow-dark

splide__arrow--prev

circle-slider-arrow-prev-dark

splide__arrow--next

circle-slider-arrow-next-dark

splide__pagination

右侧滑块分页

表格要素

谢谢！我们已收到您提交的信息！

哎呀！提交表格时出错。

图标（图像）

图标高度-xx 小

图标高度-x 小

图标高度-小

图标高度-中

图标高度-大

图标高度-自定义1

图标-1X1-XX小

图标-1x1-小号

图标-1x1-小

图标-1x1-中号

图标-1x1-大

图标-1x1-自定义1

图标（HTML 嵌入）
HTML 嵌入图标可让您控制图标悬停时的颜色。

图标嵌入-xx小

图标嵌入式小号

图标嵌入-小

图标嵌入式中型

大图标嵌入

图标嵌入-大

图标嵌入-自定义1

结构类

定义灵活的核心结构，可用于所有或大部分页面。

页面包页

主包层

集装箱-小

容器-中型

大型集装箱

padding-global

padding-section-small

中号

padding-section-large

按钮组

最大宽度

使用 max-width CSS 属性将内部内容限制在最大宽度内。

max-width-full

max-width-full-tablet

最大宽度-全像

最大全景宽度

max-width-xxlarge

max-width-xlarge

最大宽度-大

max-width-medium

最大宽度-小

max-width-xsmall

max-width-xxsmall

衬垫

方向类

padding-bottom

顶部

padding-vertical

padding-horizontal

padding-left

padding-right

尺寸等级

填充-0

填充-微小

padding-xxsmall

padding-xsmall

padding-small

填充-中

padding-large

衬垫-大

衬垫-xx 大

padding-huge

填充巨大

padding-xxhuge

padding-custom1

padding-custom2

padding-custom3

边缘

方向类

margin-bottom

margin-top

margin-vertical

margin-horizontal

margin-left

右边距

尺寸等级

边距-0

微小

margin-xxsmall

margin-xsmall

margin-small

边距-中

边距大

margin-xlarge

margin-xxlarge

巨额利润

margin-xhuge

margin-xxhuge

margin-custom1

margin-custom2

margin-custom3

实用类

我们喜欢在大多数项目中使用这些有用的实用类，以加快构建速度。

隐藏

该元素被隐藏

隐藏式平板电脑

隐藏-移动-肖像

隐藏移动景观

溢出可见

溢出隐藏

自动溢出

溢出滚动

指针-事件-开启

指针-事件-关闭

层次

分隔方形

间距-清洁

对齐中心

z-index-1

z-index-2

内嵌式显示

margin-top-auto

自下而上