除了内置图标外,您可以在内容中的任何宏替换的地方使用图标宏添加图标。本页面涵盖了图标宏的结构,目标如何被解析,以及它支持的功能(取决于图标模式)。

解剖学

图标宏是一种内联宏。与其他内联宏一样,它的语法遵循熟悉的模式,即宏名称和目标之间用冒号分隔,然后是用方括号括起来的属性列表。

图标:<目标>[<属性列表>]

<target>` 是图标的名称或路径。<attrlist> 指定各种命名属性来配置图标的显示方式。

例如:

icon:heart[2x,role=red]

例子

这是一个示例,展示了如何在一系列标签名称前插入一个名为_tags_的图标。

icon:tags[] ruby, asciidoctor

当`icons`属性未设置或为空时,这是HTML转换器转换图标宏的方式。

结果:HTML输出
<div class="paragraph">
  <p><span class="image"><img src="./images/icons/tags.png" alt="tags"></span> ruby, asciidoctor</p>
</div>

这是DocBook转换器如何转换图标宏的方式。

<inlinemediaobject>
  <imageobject>
    <imagedata fileref="./images/icons/tags.png"/>
  </imageobject>
  <textobject><phrase>tags</phrase></textobject>
</inlinemediaobject> ruby, asciidoctor

当图标的图像在图标目录中找不到时,AsciiDoc处理器会显示图标宏的alt(即备用)文本。

如何解析图标

图标宏的目标是一个图标名称(或路径)。如何解析该目标取决于分配给icons attribute的图标模式。

文本

图标名称将被包含在方括号中(例如,[heart])。

图像

图标名称将被解析为`iconsdir`中指定`icontype`文件扩展名的文件(例如,./images/icons/heart.png)。

字体

图标名称将被解析为图标字体中的一个字形(通过CSS类映射)(例如,fa fa-heart)。

Warning
如果在图像目标中包括文件扩展名,在使用字体图标模式(即`icons=font`)时,图标宏将无法正确工作。

图标宏属性(共享的)

图标宏的以下属性在所有图标模式下是共享的。

角色

应用于包围图标的元素的角色。

标题

当鼠标悬停在图片上时显示的标题。

链接

用于图标的URI目标,它将用链接包裹转换后的图标。

window

链接的目标窗口(当指定了`link`属性时)。

角色

这是一个图标的例子,它使用角色来指定颜色。

icon:tags[role=blue] ruby, asciidoctor

链接和窗口

以下是一个带有链接的图标示例,该链接的目标是打开一个新窗口:

icon:download[link=https://rubygems.org/downloads/whizbang-1.0.0.gem, window=_blank]

图标宏属性(仅限图像模式)

下面列出的属性仅在使用图像图标模式时适用。

alt

<img>` 元素的替代文本(HTML输出)或 <inlinemediaobject> 元素的文本(DocBook输出)

宽度

应用于图像的宽度。

例如,以下是在使用图像图标模式时如何控制图标的替代文本和宽度:

icon:tags[Tags,width=16] ruby, asciidoctor

图标宏不支持更改其物理位置的任何选项(如对齐方式)。

图标宏属性(仅限字体模式)

图标宏有一些属性可以修改基于字体的图标的大小和方向。这些属性仅在字体图标模式下被识别。

尺寸

第一个位置属性;缩放图标;可选值:1x(默认)、2x3x4x5xlg、`fw

旋转

旋转图标;值:90180、`270

翻转

翻转图标;可选值:水平,`垂直

尺寸

要将图标大小设置为默认值的两倍,请在方括号内输入`2x`。

icon:heart[2x]

或者

icon:heart[size=2x]
Tip

如果你想要排列图标,以便将它们用作列表中的项目符号,请按照以下方式使用`fw`大小:

[%hardbreaks]
icon:bolt[fw] bolt
icon:heart[fw] heart

旋转和翻转

要旋转和翻转一个图标,请使用命名属性来指定这些选项:

icon:shield[rotate=90, flip=vertical]