您好，我刚刚获得 Obsidian.md，想要一种很好的方式来添加标题和跟踪数字。我是 HTML 和 CSS 的新手，但一直磕磕绊绊。我正在使用 HTML 制作图形，并且想在图形标题前添加“Fig.”。 X'，其中 X 是我笔记中的数字编号，我写了这个片段
<style>
/* initialise the counter */
body { counter-reset: figureCounter; }
/* increment the counter for every instance of a figure even if it doesn't have a caption */
figure { counter-increment: figureCounter; }
/* prepend the counter to the figcaption content */
figure figcaption:before {
content: "Fig " counter(figureCounter) ": "
}
</style>
不幸的是，似乎每个人物都有“图”。 1'.有谁知道为什么我的代码似乎“忘记”有多少个数字？我测试了将我的图形包裹在正文中，这正确地创建了图 1 和图 2，但我不想将整个笔记包裹在 .
中<body>
<figure>
<img src = "link" width = 250>
<figcaption>This is the caption</figcaption>
</figure>
<figure>
<img src = "link" width = 250>
<figcaption>This is the caption</figcaption>
</figure>
</body>
如有任何帮助，我们将不胜感激，提前致谢！
将图形包裹在包装元素内，例如
<div class="figure__wrapper">
<div class="figure__wrapper">
<figure>
<img src="link" width="250">
<figcaption>This is the caption</figcaption>
</figure>
<figure>
<img src="link" width="250">
<figcaption>This is the caption</figcaption>
</figure>
</div>
更新CSS
.figure__wrapper { counter-reset: figureCounter; }
.figure__wrapper figure { counter-increment: figureCounter; }
.figure__wrapper figure figcaption:before {
content: "Fig " counter(figureCounter) ": ";
}