跳到主要内容

排版

Worldskills使用Frutiger作为主要字体与inria称为Serif伴侣。

  • WorldSkills为这些字体提供了用于Worldskills.org的许可证
  • 成员需要自己的许可和在线使用这些字体的方式
  • 有关我们字体的更多详细信息,请参阅我们的品牌书籍

排版刻度

WorldSkills使用符号,该规模假设用户的浏览器具有通常的1REM = 16px。

$ font-size-7xl:7.5REM!默认;// 120.
$ font-size-6xl:5.625REM!默认;// 90.
$ font-size-5xl:3.75REM!默认;// 60.
$ font-size-4xl:2.5REM!默认;// 40.
$ font-size-3xl:2REM!默认;// 32.
$ font-size-2xl:1.5em!默认;// 24.
$ font-size-xl:1.25REM!默认;// 20.
$ font-size-lg:1.125REM!默认;// 18.
$ font-size-base:1REM!默认;// 16.
$ font-size-sm:0.875REM!默认;// 14.

这转换为标题如下:

H1

H2

H3

H4.

H5.
H6

可以标记标题,但使用CSS类更改大小,例如,

H1标题具有H2尺寸


身体副本

身体副本具有最大宽度,以保持良好的衡量标准(文本的长度)并确保可读文本。

例子

lorem ipsum dolor坐在amet,贴心精英的白叶Maecenas Commodo.IACULIS URNA,非Lobortis.托架interdum。Donec Viverra,Leo Pharetra Venenatis的结果,Libero Arcu Molestie.Mauris,NEC Facilisis1麦格纳2SEM SED EST。NULLA FACILISI。库拉谢ac ac前院NISL。玛基亨德勒特,萨佩恩坐在艾美精灵奥纳雷,库格·斯特斯·塞尔里斯,viacerra purus ligulanec tellus。

Aliquam A直径Ac Acuue Interdum Tincidunt。Donec等Nunc Eget Sem Venenatis Iaculis。Cras Est Lorem,Ultricies Vitae Venenatis欧盟,Accumsan欧盟Neque。Leo Eu Arcu Ultrices Posuere的Pellentesque。

  1. 订购列表。Cras Faucibus Enim Quis Turpis Tempus,坐在Amet Tincidunt Tellus Interdum。Curabitur Nisi Tellus,Ullamcorper Quis Pellentesque Quis,Fermentum Condmiceum Dui。
  2. Duis Faucibus Odio Sed Posuere Iaculis。
  3. UT AC Libero Leo。

和一个段落在这里。

  • 无序列表。Cras Faucibus Enim Quis Turpis Tempus,坐在Amet Tincidunt Tellus Interdum。Curabitur Nisi Tellus,Ullamcorper Quis Pellentesque Quis,Fermentum Condmiceum Dui。
  • Duis Faucibus Odio Sed Posuere Iaculis。
  • UT AC Libero Leo。

和一个段落在这里。


立方体标题

使用编辑器中使用样式>多维数据集图标或添加CSS类之前添加多维数据集.ws-h-icon

H1与多维数据集图标

H2与多维数据集图标

H3与多维数据集图标

H4与多维数据集图标

H5与多维数据集图标
H6与多维数据集图标

引导介绍

使用STYLES> READ在CONTRITE5编辑器或添加CSS类中的介绍更大的文本。带领

例子

Aliquam A直径Ac Acuue Interdum Tincidunt。Donec等Nunc Eget Sem Venenatis Iaculis。Cras Est Lorem,Ultricies Vitae Venenatis欧盟,Accumsan欧盟Neque。Leo Eu Arcu Ultrices Posuere的Pellentesque。


inria / serif字体

使用Concrete5编辑器中的样式> Serif字体将文本更改为Serif或添加CSS类.text-serif.

注意:我们正在使用Serif字体作为Frutiger的浮雕,而不是更换,因此只使用它谨慎使用。

例子

Aliquam A直径Ac Acuue Interdum Tincidunt。


永远不要使用“点击此处”获取链接。

  • “这里”隐藏用户的点击
  • 避免仅使用动词作为锚
  • 尝试结束链接
  • 在不言“点击此处”的情况下,请点击使用“用户”

有关更多信息,请阅读本文有关可访问和可用链接的文章从粉碎杂志。


当链接具有不寻常的行为时,如链接非现场或下载PDF,我们应该警告我们的用户。

例子

studica.com/worldskills< span类=“仅限SR-only”>(外部链接)

此代码将警告屏幕读者有关外部链接并添加图标:

studica.com/worldskills.(外部链接)

例子

当链接将下载PDF时,请尝试告诉用户并指出文件的大大:

下载Worldskills Vision 2025(PDF,3.8MB)