如何通过 CSS 向 HTML 页面添加标题？

【问题标题】：How could I add a header to a HTML page via CSS?如何通过 CSS 向 HTML 页面添加标题？
【发布时间】：2015-11-23 08:29:52
【问题描述】：

有一个脚本使用 Pandoc 生成输入 Markdown 文件的 HTML 表示。假设我对 HTML 表示的唯一控制是单个 CSS 文件的规范，我如何向 HTML 添加站点标题/标题？

例如，假设我想在此处添加一些非常简单的标题，有点像顶部的“ATLAS 简报”栏，我将如何在 CSS 中而不是在页面的 HTML 中做到这一点？：

【问题讨论】：

可以用css3添加内容
您不应该仅通过 CSS 添加标记。 CSS 仅用于样式化已有的内容。

标签： html css title pandoc heading

【解决方案1】：

使用::after 或::before 伪元素中的content 属性添加其他文本。

您也可以使用absolute 和top/bottom,left/right 属性将其定位到其他位置。

#site-title::after {
  content: "Another Title";
  /* If you need to position it, uncomment and modify the below values
  position: absolute;
  top: -5px; 
  left: 20px */
}

/* Add below rule if you need to position the additional text w.r.t to the current title */
#site-title{
  position: relative;
}

输出：

【讨论】：

content 属性接受 URL，但 MDN docs 的确切含义相当模糊。
是的，我明白了。但我认为 OP 只想在此处添加文本，而不是 URL，除非 OP 想进一步澄清。