Markdown 属性
概述
Hugo 支持在图像和块元素（包括块引用、围栏代码块、标题、水平规则、列表、段落和表格）上使用 Markdown 属性。
例如
This is a paragraph.
{class="foo bar" id="baz"}
对于 class 和 id，您可以使用简写表示法
This is a paragraph.
{.foo .bar #baz}
Hugo 将两者渲染为
<p class="foo bar" id="baz">This is a paragraph.</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 不同，布尔属性必须同时具有键和值。
例如
> This is a blockquote.
{class="foo bar" hidden=hidden}
Hugo 将此渲染为
<blockquote class="foo bar" hidden="hidden">
<p>This is a blockquote.</p>
</blockquote>
在大多数情况下，将属性列表放在标记元素下方。对于标题和围栏代码块，请将属性列表放在右侧。
| 元素 | 属性列表的位置 |
|---|---|
| blockquote | 底部 |
| 围栏代码块 | 右侧 |
| 标题 | 右侧 |
| 水平规则 | 底部 |
| 图像 | 底部 |
| 列表 | 底部 |
| 段落 | 底部 |
| 表格 | 底部 |
例如
## Section 1 {class=foo}
```bash {class=foo linenos=inline}
declare a=1
echo "${a}"
```
This is a paragraph.
{class=foo}
如上所示，围栏代码块的属性列表不限于 HTML 属性。您还可以通过传递这些选项中的一个或多个来配置语法高亮。