如何使用 SASS 在图像下方显示图像标题?

Question

给定图像指定了其title参数，如何使其在图像下方的页面上可见？ 例如，通过将其复制到&:after内容(我不知道语法，我是第一次使用 ASS(。

Answer 1

你不能使用CSS来实现这一点，因此，也不使用SASS，Less，Stylus或其他东西。

这样做的原因是::before和::after只能用于可以具有content的元素(这是开始标记和结束标记之间的元素(。

例：

<div>
content
</div>

在此示例中，浏览器可以插入::before并::after如下所示：

<div>
::before
content
::after
</div>

但是，img标签不能有content，因为它根本没有结束标签：

<img src="path/to/my/img.png" title="my image title" />

如您所见，没有内容，因此没有插入的位置::before和::after.

不能使用的其他元素::before并::after：

<input /> <!-- doesn't matter which type -->
<br />
<hr />