UI宏样式

Asciidoctor 支持三种开箱即用的 UI元素表示,它们由相应的内联 UI 宏组成。

  • button(btn 宏)

  • keybinding(kbd 宏)

  • menu(menu 宏)

UI 元素使用语义 HTML 元素输出,因此它们继承了浏览器的一些默认样式。然而,为了看起来合适,它们需要一些额外的样式。

Button

按钮 表示屏幕上的按钮( btn:[Save] )。但是,它不应该看起来像一个实际的按钮,因为这会使读者误认为它是交互式的。因此,按钮默认呈现为粗体文本:

<b class="button">Save</b>

传统上,按钮引用的样式是用方括号包围文本,如下所示:

btn:[Save]

键绑定( kbd 宏)

键绑定 可以是单个键( kbd:[F11] )或一系列键( kbd:[Ctrl+F] )。下面是为这两个表单生成的 HTML 。

<kbd>F11</kbd>
<span class="keyseq"><kbd>Ctrl</kbd>+<kbd>F</kbd></span>

以下是可能出现的情况:

kbd:[F11]
kbd:[Ctrl+F]

菜单

菜单 可以是顶级菜单引用( menu:File[] )或嵌套选择( menu:File[Save] )。下面是为这两个表单生成的 HTML。

<b class="menuref">File</b>
<span class="menuseq"><b class="menu">File</b>&#160;<b class="caret">&#8250;</b> <b class="menuitem">Save</b></span>

这可能被渲染为:

menu:File[]

menu:File[Save]

应用于菜单引用的默认样式通常就足够了。