github - 在 Markdown Jekyll 中使用图像标题

Question

我在 Github 上托管 Jekyll 博客，并使用 Markdown 撰写帖子。当我添加图像时，我按以下方式执行操作:

![图像名称](http://link.com/image.jpg)

这会显示文本中的图像。

但是，我如何告诉 Markdown 添加显示在图像下方或上方的标题？

Answer 1

我知道这是一个老问题，但我想我仍然会分享我添加图像标题的方法。您将无法使用 caption 或 figcaption 标记，但这将是一个简单的替代方案，无需使用任何插件。

在 Markdown 中，您可以使用强调标记包裹标题并将其直接放在图像下方，而无需插入新行，如下所示:

![](path_to_image)
*image_caption*

这将生成以下 HTML:

<p>
    <img src="path_to_image" alt>
    <em>image_caption</em>
</p>

然后在 CSS 中，您可以使用以下选择器对其进行样式设置，而不会干扰页面上的其他 em 标记:

img + em { }

请注意，图像和标题之间不能有空行，因为这会生成:

<p>
    <img src="path_to_image" alt>
</p>
<p>
    <em>image_caption</em>
</p>

您还可以使用除 em 之外的任何您想要的标签。只需确保有一个标签，否则您将无法对其进行样式设置。