目(plain heading)是一種風格的一塊文字,雙重標題將標題分割成兩個部分,你可以自行風格化,因此第一個字和第二個字各自得到自己的顏色、背景和排版,這就是你建立一個雙音標題的樣子 主插件 旁边一种颜色 为元素者 在另一个中,不触摸自定义 CSS。
的 双标题小部件 在 Elementor 的主插件 将两个部分、可选子标题和可选图标打包到单个小部件中。本指南涵盖了内容和样式选项卡中的每个设置,使用与主插件免费附带的相同小部件。
Here’你最终会得到什么, 一个双色标题,上面有一个图标,下面有一个子标题:
在开始之前 #
- 安装元件并处于活动状态
- 已安装并激活的 Elementor 主插件 (安装指南)
- Elementor 编辑器中打开的页面或模板
步骤 1:添加双标题小部件 #
Elementor编辑器中,打开小部件面板并搜索 双头。拖到你的页面上,主插件小部件带有“MA”徽章,所以很容易在列表中发现,一旦它出现在页面上,编辑器就会打开 编辑双标题 左侧的面板包含三个选项卡:内容、样式和高级。
第 2 步:设置内容 #
的 内容 tab是你键入文本并选择基本布局的地方, 每个字段都做什么:
- 样式预设 2个部分选择一个现成的外观。切换预设会改变第一个标题和第二个标题坐在一起的方式。
- 对齐 将整个块设置为左、中或右。
- 第一个标题 是标题的第一部分(例如,“master Addons”)。
- 第二个标题 是(“对于elementor”)的第二部分,这通常是你用不同的颜色突出显示的部分。
- 标题 URL 使整个标题成为链接,方便英雄部分使用。
- 子标题 是标题下的描述行。
- 启用图标 打开标题上方的图标。
- 标题标签 HTML 标签设置,H1 到 H6。将 H1 用于页面的主标题,将 H2 用于部分标题,这样页面就保持了干净的标题结构。
步骤 3:添加图标(可选) #
翻转 启用图标 到 是的 和一个 图标 field 显示。从库中选择任意图标, 或者上传自己的 SVG。Master Addons 捆绑包 8个高级图标库elementor 的情况下,因此有数千种可供选择,该图标位于标题上方,遵循您之前设置的相同对齐方式。
第 4 步:设计第一个和第二个标题 #
切换到 风格 tab。这是双标题赢得其名称的地方。您将获得单独的部分 第一个标题 並 第二个标题的, 每个都有自己的控件:
- 文本颜色 对于标题的那部分
- 背景 该部分背后的颜色(这就是盒装双色外观的创建)
- 版式 对于字体系列、大小、重量和间距
- 填充 並 保证金 控制每个部分周围的间距
由于这两个部分是独立的,您可以给第一部分一个深色背景,第二部分一个红色背景,或者与您的品牌颜色完全匹配。将第二标题背景设置为品牌口音,您将获得人们在英雄部分中使用的突出显示的单词效果。需要注意的一件事:如果两个部分使用不同的填充物,它们可能会看起来不均匀,因此当您希望盒子对齐时,可以将两侧设置为相同的值。
第 5 步:设计小标题 #
的 描述 section 样式标题下的子标题行。你得到 文本颜色, 版式的,而且一样 填充 並 保证金 controls。drop 颜色到更柔和的灰色为一个正常的字幕, 或匹配它到其中一个标题颜色, 以绑在一起的块。
第 6 步:为图标设计样式 #
如果您打开图标, 图标风格 部分控制它。设置 图标尺寸 与滑块一起以像素为单位,然后选择一个 图标颜色 对于两者来说 正常 並 悬停 states。com整个航向是一个链接时,单独的悬停颜色是一个很好的触摸。
当标题看起来正确时,单击 发表 (或x),在2019年1月17日,在2019年1月1日,在 更新的)来保存页面。
双标题小部件有帮助的地方 #
- 英雄部分的,其中一个双色标题吸引了重要部分的眼睛。
- 部分标题 这需要一个突出显示的单词,例如 “我们的 最好的 工作量。
- 着陆页(widget) 中将粗体标题与支持小标题配对。
- 定价或功能块其中盒装双色调风格构成了标题。
常见问题 #
Elementor 中的双标题小部件是什么?
Master Addons小部件,将标题分成两个部分,你可以单独进行样式设计,每个部分都有自己的颜色、背景和排版,因此你可以构建一个双色标题,而无需编写任何CSS。
如何在 Elementor 中制作双色标题?
添加主插件双标题小部件,将文本输入到第一标题和第二标题中,然后打开"样式"选项卡并为每个部分设置不同的文本颜色或背景。这会给你一个双色标题。
我可以在标题中添加小标题和图标吗?
是。子标题字段在标题下添加描述行,启用图标切换在其上方放置一个图标。在颜色、大小和排版的样式选项卡中,两者都有自己的样式控件。
我应该使用哪个标题标签?
H1设置页面的主标题和H2设置部分标题,将标签与标题的角色匹配可以保持页面结构的干净,这对于读者和搜索引擎都有帮助。
我需要用于双标题小部件的 Elementor Pro 吗?
号双标题小部件与Elementor的免费版本配合使用,因此其所有内容和样式设置都可以在没有Elementor Pro的情况下使用。
