详细信息
v0.140.0 中的新增功能
示例
使用此标记
{{< details summary="See the details" >}}
This is a **bold** word.
{{< /details >}}
Hugo 渲染此 HTML
<details>
<summary>See the details</summary>
<p>This is a <strong>bold</strong> word.</p>
</details>
在您的浏览器中看起来像这样
查看详细信息
这是一个 粗体 字。
参数
- summary
- (
string)从 Markdown 渲染为 HTML 的子summary元素的内容。默认值为Details。 - open
- (
bool)是否最初显示details元素的内容。默认值为false。 - class
- (
string)details元素的class属性。 - name
- (
string)details元素的name属性。 - title
- (
string)details元素的title属性。
样式
使用 CSS 设置 details 元素、summary 元素和内容本身的样式。
/* target the details element */
details { }
/* target the summary element */
details > summary { }
/* target the children of the summary element */
details > summary > * { }
/* target the content */
details > :not(summary) { }