热门搜索词:

TAS 样式菜单 – 复制模块

复制模块几乎用于 TAS 网站的每个页面。它是向用户提供 HTML 内容的主要手段。有许多选项可以添加间距、调整布局并以各种方式呈现内容。最基本的呈现方式是带有常规段落的标题文本。有时使用块引用来突出内容。

复制模块还能够以列或框的形式显示内容。以下示例演示了每种方式。


可用选项:

  • 垂直边距 - 包含模块之前和/或之后的更多/正常/更少的空间。
    顶部和底部 | 顶部 | 底部 | 无 | 顶部和底部负片 | 顶部负片 | 底部负片
  • 标题 – 作为 H2 标题(带有“section-heading”类)包含在模块顶部的文本。
    文本
  • 标题样式 – 标题的显示样式。行居中在标题文本旁边插入一条水平线,延伸容器宽度的剩余部分。正常与此相同,没有水平线。下划线使标题变小(26px 对 40px),并在下方插入一条线,即容器的整个宽度。
    线中心 | 正常 | 下划线
  • 背景纹理 – 在模块的顶部、底部或顶部添加点状“纹理”。位置很明显。(这通常仅用于在内容中创建“硬”中断,超出间距或水平线所传达的范围)。
    顶部 | 底部 | 顶部和底部 | 已禁用
  • 背景颜色 – 设置模块的背景颜色。白色为默认颜色,不设置背景颜色(允许显示父容器的颜色 #FFFFFF)。白色烟雾将背景颜色设置为 #F7F6F4,并在顶部和底部添加 20px 的填充(默认情况下如此)。爱丽丝蓝和铂金蓝都在顶部和底部添加了 80px 的填充。爱丽丝蓝将背景设置为 #EDF7F7。铂金蓝将背景设置为 #E1E8EC。
    爱丽丝蓝 | 烟白色 | 白色 | 铂金蓝
  • 正文对齐 - 设置正文文本的对齐方式。左侧将容器的最大宽度设置为 650px。全宽跨越带有文本的容器元素的宽度。居中对齐容器到父容器的中心,但文本仍然左对齐。
    左 | 中 | 全宽
  • 正文 – 普通段落级文本,带有可选标题和样式。模块的主要内容。
    开放文本
  • 背景颜色 - (位于正文主要部分内)。透明不会为正文部分设置背景颜色。天青色和爱丽丝蓝都提供了“全宽”或“方框”的附加选项。全宽将背景颜色扩展到整个页面宽度。方框仅跨越容器宽度。天青色将背景设置为 #E1E8EC。爱丽丝蓝将背景设置为 #EDF7F7。
    天青色 | 爱丽丝蓝 | 透明
  • 正文栏 – 此按钮允许创建内容子部分,这些子部分具有自己的标题和内容栏。每个子部分都显示在宽度为父部分一半的容器中。在正文栏部分下方会出现一个附加复选框,标记为“背景蓝色”。
    • 标题 – 这是一个单行文本字段,显示 H3 标题中的内容。
      文本
    • 正文 – 这是一个开放文本字段,以文本形式显示内容元素。标题和正文一起显示。
      开放文本
    • 背景蓝色 – 如果添加了一个或多个正文列部分,则会出现一次,并应用于所有部分。这是一个复选框,显示在添加的正文列部分下方。选中此选项会将所有列的容器背景颜色设置为 #EDF7F7。
      是 | 不
  • 盒装副本 – 此按钮允许创建内容的子部分,这些子部分具有自己的标题,内容周围有一个框。每个子部分都像略微凸起的卡片(带有背景阴影),宽度为父部分的一半。
    • 标题 – 这是一个单行文本字段,显示 H3 标题中的内容。
      文本
    • 正文 – 这是一个开放文本字段,以文本形式显示内容元素。标题和正文都一起显示在“卡片”中。
      开放文本

下面是具有推荐/典型设置的模块示例(垂直边距 = “顶部和底部”, 示例标题和文本, 标题样式 = 正常, 背景纹理 = 已禁用, 背景颜色 = 白色, 正文标题和正文示例,背景颜色(正文主体)=透明, 正文栏的示例标题和文本 – 乘以 2 以进行演示).


仅限正文

这是正文(对齐设置为居中)。此示例模块未设置列或框。这完全灵活,可以显示任何 HTML 内容。它是所有文章的默认内容“容器”。

为了演示,此复制模块将复制对齐设置为“中心”,并将背景颜色设置为“爱丽丝蓝”(选项设置为“框”而不是“全宽”。上面的描述部分实际上使用了默认复制模块,对齐设置为“全宽”,背景设置为“透明”。

Etiam diam metus,pulvinar id leo vehicula,egestas actor nulla。现在在我的司令官生活中。暂停效力。 Donec eu metus condimentum,condimentum dui id,ultricies mi。菜豆 (Phasellus mollistincidunt nisl non ullamcorper)。 Donec vulputate non magna ut pellentesque。


正文栏

这是正文(对齐设置为全宽),而不是正文列。这完全灵活,可以显示任何 HTML 内容。它是所有文章的默认内容“容器”。列(如下所示)是可选的,但应成对显示,以保持视觉平衡。

Etiam diam metus,pulvinar id leo vehicula,egestas actor nulla。现在在我的司令官生活中。暂停效力。 Donec eu metus condimentum,condimentum dui id,ultricies mi。菜豆 (Phasellus mollistincidunt nisl non ullamcorper)。 Donec vulputate non magna ut pellentesque。

列标题

Lorem ipsum dolor sat amet,consectetur adipiscing elit。 Aenean molestie sagittis sem 坐 amet 发酵。 Nullam tortor nulla,fringilla vitae feugiat eu,elementum vitae dui。 Proin nec tempor odio。 Quisque finibus ullamcorper tempus。 Vivamus blandit enim dolor, vitae egestas ipsummalesuada pharetra。 Proin eu semper eros。 Etiam quis Massa bibendum,mattis lectus id,blandit ipsum。 Etiam ac venenatis ex, ut commodo totortor. Morbi vel Egestas dolor。 Aenean blandit sem arcu,sed euismod nunc hendrerit sat amet。 Donec nec imperdiet lorem。

列标题 2

Lorem ipsum dolor sat amet,consectetur adipiscing elit。 Aenean molestie sagittis sem 坐 amet 发酵。 Nullam tortor nulla,fringilla vitae feugiat eu,elementum vitae dui。 Proin nec tempor odio。 Quisque finibus ullamcorper tempus。 Vivamus blandit enim dolor, vitae egestas ipsummalesuada pharetra。 Proin eu semper eros。 Etiam quis Massa bibendum,mattis lectus id,blandit ipsum。 Etiam ac venenatis ex, ut commodo totortor. Morbi vel Egestas dolor。 Aenean blandit sem arcu,sed euismod nunc hendrerit sat amet。 Donec nec imperdiet lorem。


盒装

这是正文(对齐设置为全宽),而不是带框的正文。这完全灵活,可以显示任何 HTML 内容。它是所有文章的默认内容“容器”。框(如下所示)是可选的,但应成对出现,以保持视觉平衡。

Etiam diam metus,pulvinar id leo vehicula,egestas actor nulla。现在在我的司令官生活中。暂停效力。 Donec eu metus condimentum,condimentum dui id,ultricies mi。菜豆 (Phasellus mollistincidunt nisl non ullamcorper)。 Donec vulputate non magna ut pellentesque。

框标题

Lorem ipsum dolor sat amet,consectetur adipiscing elit。 Aenean molestie sagittis sem 坐 amet 发酵。 Nullam tortor nulla,fringilla vitae feugiat eu,elementum vitae dui。 Proin nec tempor odio。 Quisque finibus ullamcorper tempus。 Vivamus blandit enim dolor, vitae egestas ipsummalesuada pharetra。 Proin eu semper eros。 Etiam quis Massa bibendum,mattis lectus id,blandit ipsum。 Etiam ac venenatis ex, ut commodo totortor. Morbi vel Egestas dolor。 Aenean blandit sem arcu,sed euismod nunc hendrerit sat amet。 Donec nec imperdiet lorem。

框标题 2

Lorem ipsum dolor sat amet,consectetur adipiscing elit。 Aenean molestie sagittis sem 坐 amet 发酵。 Nullam tortor nulla,fringilla vitae feugiat eu,elementum vitae dui。 Proin nec tempor odio。 Quisque finibus ullamcorper tempus。 Vivamus blandit enim dolor, vitae egestas ipsummalesuada pharetra。 Proin eu semper eros。 Etiam quis Massa bibendum,mattis lectus id,blandit ipsum。 Etiam ac venenatis ex, ut commodo totortor. Morbi vel Egestas dolor。 Aenean blandit sem arcu,sed euismod nunc hendrerit sat amet。 Donec nec imperdiet lorem。