html - 如何通过 CSS 将 header 添加到 HTML 页面?

标签 html css title pandoc heading

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

例如,假设我想添加一些非常简单的标题,有点像顶部的“ATLAS Briefings”栏,我该如何在 CSS 中而不是在页面的 HTML 中做到这一点?:

最佳答案

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

您还可以使用 absolutetop/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;
}

输出:

enter image description here

关于html - 如何通过 CSS 将 header 添加到 HTML 页面?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32275095/

相关文章:

title - Pandoc:更改 DOCX 输出中的标题样式

window - 如何在python qt中设置windows标题?

html - 标题和元标记装饰(样式)

javascript - 试图隐藏一个项目 block ,以便在单击特定文本框时显示,

html - Core-icons 图标在 Polymer 1.2.1 中未按预期显示

javascript - CSS3 从 'left' 属性过渡到 'right' 属性

css - 如何在多行上扩展 css 文本动画?

javascript - 当达到 maxlength ="11"时如何放置 HTML 验证错误?

javascript - 是否可以使用 Python 和 JS/CSS 中的 GUI 构建程序?如何整合语言?

html - 隐藏 HTML 元素作为临时 bot 预防方法的推荐方法