如何修改子比主题的文章标题样式

需求

标题二（h2）的文字大小要合适，颜色能够随主题颜色而自动切换，标题前面需要有一条竖线。

前端样式如图所示：

步骤

1. 前往网站服务器后台（如“宝塔”），找到“/www/wwwroot/你的域名/wp-content/themes/zibll/css/main.min.css”文件，删除（或注释）如下选择器代码（不是具体的样式代码）：

.wp-posts-content>h2.wp-block-heading:before,
.wp-posts-content>h2:not([class]):before,

如图所示：

这样做的目的是清除原来的样式，防止与新样式的CSS文件相冲突，如果你觉得原来的CSS文件太紧凑了，不美观，可以进入这个网站进行美化或者压缩：https://tool.lu/css/。

2. 登录WordPress后台，在“Zibll主题设置” - “全局功能” - “自定义代码” - “自定义CSS样式” 中，添加如下代码：

/*** 文章标题样式 ***/
.wp-posts-content h2 {
    padding: 8px 12px;
    margin: 14px 0;
    border: 0;
    font-weight: 700;
    color: var(--theme-color);
    font-size: 22px
}
.wp-posts-content h2:before {
    position: absolute;
    content: '';
    width: 4px;
    background: var(--theme-color);
    top: 10%;
    left: 2px;
    bottom: 10%;
    border-radius: 5px;
    transition: .4s
}
.wp-posts-content h3 {
    font-size: 20px
}

最后，强制刷新一下网页即可出现开头的样式。