双头

目(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 的主插件