GitHub Pages Minimal Mistakes仅在标签页显示标题实现方法

先直接回答你的核心疑问 #

display: none 不会隐藏浏览器标签栏的标题，这个方案逻辑上可行，但你完全没必要手写CSS——你用的academicpages是基于Minimal Mistakes主题开发的，主题本身就自带了隐藏正文页标题的配置，比自己写样式稳定得多。

原理说明 #

你在页面头部---包裹的Front Matter配置里写的title值，主题渲染时会拆成两个完全独立的部分处理：

• 第一部分写入HTML的<head>区的<title>标签，这部分是元数据，只给浏览器、搜索引擎读取，不会显示在页面正文里，CSS规则根本作用不到这个区域，所以不管你怎么加display: none，都不会影响标签栏的标题显示。
• 第二部分渲染到页面<body>区的标题元素上，作为页面顶部可见的大标题，这部分才是CSS可以控制的内容。

推荐实现（零额外代码） #

直接在对应页面的Front Matter里加一行hide_title: true就可以实现你的需求，这是主题官方提供的配置项：

---
permalink: /personal/
title: "你的自定义页面标题" # 这个值会正常出现在浏览器标签栏
excerpt: "页面摘要内容"
author_profile: true
hide_title: true # 核心配置：隐藏正文区域的标题，同时自动移除标题预留的空白空间
redirect_from: 
  - /personal.html
---
<!-- 下方直接写页面正文即可 -->
你的页面正文内容

这个方案不会留任何标题占位的空白，也不会有样式冲突，后续主题更新也不会失效，是最稳妥的实现方式。

手写display: none的实现方式 #

如果你因为特殊需求不想用主题自带配置，可以在页面正文最开头添加如下内联样式：

<style>
.page__title {
  display: none !important;
}
</style>

这段样式只会命中正文区域的页标题元素，不会影响标签栏标题。但要注意，这种方式依赖主题的类名，如果后续主题更新修改了.page__title这个类名，你的隐藏样式就会失效，所以优先推荐用前面的原生配置方案。

内容的提问来源于stack exchange，提问作者user12035742