Markdown 属性
概述
Hugo 支持在图像和块级元素（包括块引用、围栏代码块、标题、水平线、列表、段落和表格）上使用 Markdown 属性。
例如：
这是一个段落。
{class="foo bar" id="baz"}
使用 class 和 id ，您可以使用简写形式：
这是一个段落。
{.foo .bar #baz}
Hugo 将这两个示例都渲染为：
<p class="foo bar" id="baz">这是一个段落。</p>
块级元素
更新您的站点配置以启用块级元素的 Markdown 属性。
hugo.
markup:
goldmark:
parser:
attribute:
block: true
title: true
[markup]
[markup.goldmark]
[markup.goldmark.parser]
[markup.goldmark.parser.attribute]
block = true
title = true
{
"markup": {
"goldmark": {
"parser": {
"attribute": {
"block": true,
"title": true
}
}
}
}
}
独立图像
默认情况下，当 Goldmark Markdown 渲染器遇到独立的图像元素（同一行上没有其他元素或文本）时，它会根据 CommonMark 规范 将图像元素包装在段落元素中。
如果您要在图像元素下方放置属性列表，Hugo 会将属性应用于周围的段落，而不是图像本身。
要将属性应用于独立的图像元素，您必须禁用默认的包装行为：
hugo.
markup:
goldmark:
parser:
wrapStandAloneImageWithinParagraph: false
[markup]
[markup.goldmark]
[markup.goldmark.parser]
wrapStandAloneImageWithinParagraph = false
{
"markup": {
"goldmark": {
"parser": {
"wrapStandAloneImageWithinParagraph": false
}
}
}
}
使用方法
您可以添加 全局 HTML 属性 ，或当前元素类型特有的 HTML 属性。与它的内容安全模型一致，Hugo 会移除 HTML 事件属性，例如 onclick 和 onmouseover 。
属性列表由一个或多个键值对组成，它们用空格或逗号分隔，并用大括号括起来。您必须用引号括起包含空格的字符串值。与 HTML 不同，布尔属性必须同时具有键和值。
例如：
> 这是一个块引用。
{class="foo bar" hidden=hidden}
Hugo 将其渲染为：
<blockquote class="foo bar" hidden="hidden">
<p>这是一个块引用。</p>
</blockquote>
在大多数情况下，请将属性列表放在标记元素下方。对于标题和围栏代码块，请将属性列表放在右侧。
| 元素 | 属性列表位置 |
|---|---|
| 块引用 | 底部 |
| 围栏代码块 | 右侧 |
| 标题 | 右侧 |
| 水平线 | 底部 |
| 图像 | 底部 |
| 列表 | 底部 |
| 段落 | 底部 |
| 表格 | 底部 |
例如：
## Section 1 {class=foo} {#section-1-class-foo}
```bash {class=foo linenos=inline}
declare a=1
echo "${a}"
```
这是一个段落。
{class=foo}
如上所示，围栏代码块的属性列表不限于 HTML 属性。您还可以通过传递一个或多个 这些选项 来配置语法高亮显示。