是否可以使用 CSS 从伪元素内容插入 HTML 标签？

Question

我正在尝试使用伪元素在每个标签之前::before插入一个，到目前为止我有：<hr><article>

  article::before {
    content: "\003C br \\ \003E";
  }

但这行不通。还有其他方法可以将 HTML 标签插入到伪元素 CSS 中吗？

Answer 1

正如 @rounin 所说，您无法在生成的内容中插入 html。

但hr只是一个具有自定义 CSS 样式的元素。

您可以为生成的内容重新创建样式

article::before {
  content: "";
  border: 1px inset;
  box-sizing: border-box;
  color: gray;
  display: block;
  height: 2px;
  margin: 0.5em auto;
}

<article>
  Lorem ipsum dolor sit amet, consectetur adipisicing elit. Doloremque nihil odit impedit ipsam et ducimus.</article>
<article>
  Lorem ipsum dolor sit amet, consectetur adipisicing elit. Enim deleniti!
</article>