css - 如何使生成的内容可选择？

Question

我可以使用生成的内容让 CSS 显示元素的 ID，如下所示:

<style>
h2:hover:after {
  color: grey;
  content: "#" attr(id);
  float: right;
  font-size: smaller;
  font-weight: normal;
}
</style>
<h2 id="my-id">My ID</h2>
<p>Pellentesque habitant morbi tristique senectus et netus et.</p>

如何使生成的内容(“#my-id”)可选，以便用户可以突出显示并复制它？

Answer 1

您不能使伪元素可选，因为它在 DOM 中不存在。

5.10 Pseudo-elements and pseudo-classes

Neither pseudo-elements nor pseudo-classes appear in the document source or document tree.