如何移除或缩小Header与Post Title之间的空白区域

操作步骤 #

1. 确认目标元素的CSS规则

找到目标元素后，在浏览器开发者工具的「样式」面板，定位到控制该元素padding的CSS规则，记录下对应的元素选择器（比如.main-container、.page-content这类类名、ID名组合的规则标识），以及当前的padding数值。

2. 用额外CSS修改（最推荐，修改不会因主题升级丢失）

不需要改动主题源文件，直接在站点后台添加自定义CSS即可，大部分建站系统（WordPress、Typecho等）的自定义CSS入口都在「外观」-「自定义」-「额外CSS/自定义CSS」板块。
按照你记录的选择器填入以下代码，数值按需调整即可：

/* 把下面的选择器替换成你自己查到的目标元素选择器 */
.your-target-selector {
  padding: 0 !important; /* 完全移除空白就设为0，要缩小就按需填数值，比如10px 0 */
}

如果修改后未生效，说明原有CSS规则优先级更高，保留!important即可强制生效。

3. 直接修改主题文件（不推荐，主题升级会覆盖修改）

如果你一定要改主题源文件，通常主题的主样式文件是根目录下的style.css，在文件里搜索刚才记录的选择器，找到对应的padding属性直接修改数值后保存即可。如果担心升级覆盖，可以配套使用子主题存储自定义修改。

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