正文 h3/h4 与正文区分度太低，需增加样式 #29

New Issue

2026-10-27T14:56:59Z

laoyang commented

2026-10-27 14:56:59 +00:00

现象

正文里的小标题（h3）跟正文几乎分不出来。

用户原话：

第二个问题，需要给 h3 等标题，增加样式，现在 h3 只是加粗，增加了字号，其实跟正文非常相似，根本区分不出来。

已实测确认现状（线上真实计算样式）

线上正文很少用 h3，量不到现成的，所以在真实页面里注入测试标题、读 getComputedStyle()。
桌面 1440 视口实测：

元素	font-size	font-weight	line-height	装饰	上下 margin
h2	20px	500	41px	左 5px 蓝条 + 浅灰底	16 / 16
h3	18px	500	32px	无	24 / 16
h4	16px	500	32px	无	24 / 16
p（正文）	16px	350	30px	无	0 / 16

问题量化得很清楚：

h3 只比正文大 2px（18 对 16），字重只差 150（500 对 350），且没有任何装饰
h4 和正文一模一样大（16px），只靠字重区分
而 h2 有蓝条 + 灰底，一眼就能看出是标题 —— 所以对比之下 h3/h4 更显得"就是一段加粗的字"

用户选定的风格

h3：左侧竖线 + 底部细线

左 3px 蓝色竖线（比 h2 的 5px 细，体现层级次一级）
底部 1px 浅灰细线
字号 20px，字重 600
不加背景色（h2 有灰底，h3 不加，避免喧宾夺主）

h4：一起处理，17px 加粗

字号 17px，字重 600
h3 涨到 20px 后，h4 若还是 16px 会显得断层，所以同步上调

层级梯度变成：h2 20px(蓝条+灰底) → h3 20px(细竖线+底线) → h4 17px(纯加粗) → 正文 16px/350

要做的改动

在 assets/css/site.css 里新增 h3 / h4 的正文样式（与现有 h2 规则放一起，注释写清层级关系）。

⚠️ 需要确认不会打坏的：

评论区标题也是 h3 —— .comments 里那个「评论（N）」是 h3，
而 comments.css 已经有一条专门的规则把线搬到 .comments-head 容器上
（见该文件第 158-186 行的长注释）。新规则不能把它一起改了，
选择器必须限定在 .article .content 之内，且要检查与 comments.css 的优先级关系
目录锚点 h3[id]（toc.css:187）有 scroll-margin-top，不要动
归档页 h3（archives.css:59-91）明确写了"margin 必须清零 —— kratos 的
.article .content h3 会给它 margin"，那里也是 h3，同样不能被新规则影响
后台/弹窗里的 h3：选择器要足够收敛，别写成裸 h3

验收标准

打开任意有 h3 的文章：h3 左侧有 3px 蓝竖线、底部有 1px 浅灰细线，字号明显大于正文
几何/计算样式实测：
- h3 font-size = 20px，font-weight = 600
- h3 border-left-width = 3px，border-bottom-width = 1px
- h4 font-size = 17px，font-weight = 600
h3 与 p 的视觉差 ≥ 4px 字号 + 250 字重 + 至少一处装饰（这条写成判据，防止以后被改回去）
评论区那个「评论（N）」标题外观不变（标题下的横线仍然等长铺满，不是两条）
归档页 /blogtime 的月份标题外观不变
手机 390 视口下 h3 字号按比例回落，不溢出
长标题连续两行时，底部细线仍在最下方（不是每行一条）

涉及文件（预估）

assets/css/site.css（新增规则）
若要重新压 min：按现有构建方式处理
style.css 版本号

为什么单独建单

#28 是正文图片的溢出 bug（几何问题，验图片位置）；本单是 h3/h4 标题缺样式（视觉层级问题，验字号/字重/边框）。两者改的是不同 CSS 规则、在页面上互不影响、可各自单独验收，故独立立单。

## 现象正文里的小标题（h3）跟正文几乎分不出来。用户原话： > 第二个问题，需要给 h3 等标题，增加样式，现在 h3 只是加粗，增加了字号，其实跟正文非常相似，根本区分不出来。 ## 已实测确认现状（线上真实计算样式）线上正文很少用 h3，量不到现成的，所以在真实页面里注入测试标题、读 `getComputedStyle()`。桌面 1440 视口实测： | 元素 | font-size | font-weight | line-height | 装饰 | 上下 margin | |---|---|---|---|---|---| | **h2** | **20px** | 500 | 41px | 左 5px 蓝条 + 浅灰底 | 16 / 16 | | **h3** | **18px** | 500 | 32px | **无** | 24 / 16 | | **h4** | **16px** | 500 | 32px | **无** | 24 / 16 | | p（正文） | **16px** | **350** | 30px | 无 | 0 / 16 | 问题量化得很清楚： - **h3 只比正文大 2px**（18 对 16），字重只差 150（500 对 350），且**没有任何装饰** - **h4 和正文一模一样大**（16px），只靠字重区分 - 而 h2 有蓝条 + 灰底，一眼就能看出是标题 —— 所以对比之下 h3/h4 更显得"就是一段加粗的字" ## 用户选定的风格 **h3：左侧竖线 + 底部细线** - 左 3px 蓝色竖线（比 h2 的 5px 细，体现层级次一级） - 底部 1px 浅灰细线 - 字号 20px，字重 600 - **不加背景色**（h2 有灰底，h3 不加，避免喧宾夺主） **h4：一起处理，17px 加粗** - 字号 17px，字重 600 - h3 涨到 20px 后，h4 若还是 16px 会显得断层，所以同步上调层级梯度变成：h2 20px(蓝条+灰底) → h3 20px(细竖线+底线) → h4 17px(纯加粗) → 正文 16px/350 ## 要做的改动在 `assets/css/site.css` 里新增 h3 / h4 的正文样式（与现有 h2 规则放一起，注释写清层级关系）。 ⚠️ 需要确认不会打坏的： 1. **评论区标题也是 h3** —— `.comments` 里那个「评论（N）」是 h3，而 `comments.css` 已经有一条专门的规则把线搬到 `.comments-head` 容器上（见该文件第 158-186 行的长注释）。**新规则不能把它一起改了**，选择器必须限定在 `.article .content` 之内，且要检查与 `comments.css` 的优先级关系 2. **目录锚点** `h3[id]`（`toc.css:187`）有 `scroll-margin-top`，不要动 3. **归档页 h3**（`archives.css:59-91`）明确写了"margin 必须清零 —— kratos 的 `.article .content h3` 会给它 margin"，那里也是 h3，同样不能被新规则影响 4. **后台/弹窗里的 h3**：选择器要足够收敛，别写成裸 `h3` ## 验收标准 1. 打开任意有 h3 的文章：h3 **左侧有 3px 蓝竖线、底部有 1px 浅灰细线**，字号明显大于正文 2. 几何/计算样式实测： - h3 `font-size` = 20px，`font-weight` = 600 - h3 `border-left-width` = 3px，`border-bottom-width` = 1px - h4 `font-size` = 17px，`font-weight` = 600 3. **h3 与 p 的视觉差 ≥ 4px 字号 + 250 字重 + 至少一处装饰**（这条写成判据，防止以后被改回去） 4. 评论区那个「评论（N）」标题**外观不变**（标题下的横线仍然等长铺满，不是两条） 5. 归档页 `/blogtime` 的月份标题外观不变 6. 手机 390 视口下 h3 字号按比例回落，不溢出 7. 长标题连续两行时，底部细线仍在最下方（不是每行一条） ## 涉及文件（预估） - `assets/css/site.css`（新增规则） - 若要重新压 min：按现有构建方式处理 - `style.css` 版本号 --- ### 为什么单独建单 #28 是正文图片的溢出 bug（几何问题，验图片位置）；本单是 h3/h4 标题缺样式（视觉层级问题，验字号/字重/边框）。两者改的是不同 CSS 规则、在页面上互不影响、可各自单独验收，故独立立单。

laoyang referenced this issue from a commit

2026-10-27 15:15:36 +00:00

3.2.60 正文插图不吃段落缩进 + h3/h4 提升层级区分度 #28 #29

laoyang commented

2026-10-27 15:16:12 +00:00

已发布 3.2.60（commit `cca7497`）

改了什么

assets/css/site.css 新增 h3 / h4 规则 + 一条让路规则：

.k-main .details .article .content h3 {
  margin: 24px 0 16px;
  padding: 2px 0 2px 10px;
  border-left: 3px solid #00a2ff;
  border-bottom: 1px solid #eaedf2;
  font-size: 20px;
  font-weight: 600;
  line-height: 32px;
}

.k-main .details .article .content h4 {
  margin: 20px 0 12px;
  font-size: 17px;
  font-weight: 600;
  line-height: 30px;
}

改之前的实测值

桌面 1440 量到的计算样式：

h3  18px / 500 / 无任何装饰 / margin 24-16
p   16px / 350

只差 2px 字号 + 150 字重，中间没有一眼能认出的特征。放在长文里它就是
"一段稍微粗一点的字"；而 h2 有 5px 蓝条 + 浅灰底，对比之下 h3 更像正文。

改后的层级梯度

h2  20px / 500 / 左 5px 蓝条 + 浅灰底   ← 最重，分节
h3  20px / 600 / 左 3px 蓝条 + 底 1px 细线，无底色
h4  17px / 600 / 纯加粗
p   16px / 350

两个设计取舍：

h3 竖线 3px 而非 h2 的 5px —— 同族但更轻，一眼看出次一级
h3 不铺底色 —— h2 已有灰底，h3 再铺整篇会碎成一块块

两个「顺手会踩坏别处」的地方（都验过）

① 归档页年份标题也是 <h3 class="ar-year">，而且它就在 .article .content
里（[Archives] 是正文短代码）。新规则会命中它，于是年份会多出竖线，
而 archives.css 的 .ar-head 本来就有底边线 → 变两条线。

修法：显式给 h3.ar-year 清零装饰，但不碰字号字重（仍归 archives.css 的
26px/700）。为什么不让本文件也用 (0,5,0) 去压：那样谁赢就变成"看入队顺序"，
非常脆。

② 评论区标题是 h3，但不在 .content 里 —— comments_template() 是
.content 的兄弟节点，所以未被波及。这条专门验了：

PASS E1 评论区标题无左竖线      [bl=0]
PASS E2 评论区标题无下边框      [bb=0]
PASS E3 评论区分隔线仍在容器上   [bb=1]
PASS E4 评论区标题字号仍 19px    [实测 19]

验证结果

判据 52 / 0（真实页面 + page.route 拦截替换新 CSS，桌面 1440 / 手机 390）：

PASS B1 h3 字号 20px              [实测 20]
PASS B2 h3 字重 600               [实测 600]
PASS B3 h3 左竖线 3px             [3px rgb(0, 162, 255)]
PASS B4 h3 底细线 1px             [实测 1]
PASS B5 h3 无背景色               [rgba(0, 0, 0, 0)]
PASS C1 h3 比正文大 ≥4px           [20 vs 16]
PASS C2 h3 字重差 ≥200             [600 vs 350]
PASS D1 h4 字号 17px              [实测 17]
PASS D2 h4 字重 600               [实测 600]
PASS D3 层级递进：p < h4 < h3      [16 < 17 < 20]
PASS D4 h4 无装饰
PASS D5 h2 原样式未动              [5px / 20px]
PASS D6 h2 灰底仍在                [rgba(243, 243, 243, 0.7)]
PASS F1 归档年份无左竖线            [bl=0]
PASS F2 归档年份无自身下边框        [bb=0]
PASS F3 .ar-head 底边线仍 1px       [bb=1]
PASS F4 归档年份仍 26px             [实测 26]
PASS F5 归档年份仍 700              [实测 700]
PASS F6 归档年份 margin 仍清零       [0/0]
PASS F7 归档年份 padding-left 已清零 [pl=0]

反证 10 / 10 全部抓到：

注入	预期	实测
h3 字号 20→18px	退回改前	50/2 ✅
h3 字重 600→500	区分度不足	50/2 ✅
h3 竖线 3px→0	唯一装饰没了	51/1 ✅
h4 17→16px	层级断层	50/2 ✅
删掉 h3.ar-year 让路规则	归档页多一条线	49/3 ✅
阴性对照：加无关规则	不该报红	52/0 ✅

已上线

https://yangyq.net/theme-update/update.json
{"version":"3.2.60", "md5":"6b6c5ff1bdb9be2373801a59d71fdec7"}

zip 与本地字节一致，重复打包 md5 相同
readme 已并入 3.2.60 节，历史 50 段完整保留
transient 已清，后台可立刻看到 3.2.60

⚠️ 服务器主题目录仍是 3.2.59（红线：只发 zip，不解包覆盖）。
需要你在后台点一次升级，我再补确认。

## 已发布 3.2.60（commit `cca7497`） ### 改了什么 `assets/css/site.css` 新增 h3 / h4 规则 + 一条让路规则： ```css .k-main .details .article .content h3 { margin: 24px 0 16px; padding: 2px 0 2px 10px; border-left: 3px solid #00a2ff; border-bottom: 1px solid #eaedf2; font-size: 20px; font-weight: 600; line-height: 32px; } .k-main .details .article .content h4 { margin: 20px 0 12px; font-size: 17px; font-weight: 600; line-height: 30px; } ``` ### 改之前的实测值桌面 1440 量到的计算样式： ``` h3 18px / 500 / 无任何装饰 / margin 24-16 p 16px / 350 ``` **只差 2px 字号 + 150 字重**，中间没有一眼能认出的特征。放在长文里它就是 "一段稍微粗一点的字"；而 h2 有 5px 蓝条 + 浅灰底，对比之下 h3 更像正文。 ### 改后的层级梯度 ``` h2 20px / 500 / 左 5px 蓝条 + 浅灰底 ← 最重，分节 h3 20px / 600 / 左 3px 蓝条 + 底 1px 细线，无底色 h4 17px / 600 / 纯加粗 p 16px / 350 ``` 两个设计取舍： - **h3 竖线 3px 而非 h2 的 5px** —— 同族但更轻，一眼看出次一级 - **h3 不铺底色** —— h2 已有灰底，h3 再铺整篇会碎成一块块 ### 两个「顺手会踩坏别处」的地方（都验过） **① 归档页年份标题也是 `<h3 class="ar-year">`**，而且它就在 `.article .content` 里（`[Archives]` 是正文短代码）。新规则会命中它，于是年份会多出竖线，而 `archives.css` 的 `.ar-head` 本来就有底边线 → **变两条线**。修法：显式给 `h3.ar-year` 清零装饰，**但不碰字号字重**（仍归 archives.css 的 26px/700）。为什么不让本文件也用 (0,5,0) 去压：那样谁赢就变成"看入队顺序"，非常脆。 **② 评论区标题是 h3，但不在 `.content` 里** —— `comments_template()` 是 `.content` 的**兄弟节点**，所以未被波及。这条专门验了： ``` PASS E1 评论区标题无左竖线 [bl=0] PASS E2 评论区标题无下边框 [bb=0] PASS E3 评论区分隔线仍在容器上 [bb=1] PASS E4 评论区标题字号仍 19px [实测 19] ``` ### 验证结果判据 **52 / 0**（真实页面 + `page.route` 拦截替换新 CSS，桌面 1440 / 手机 390）： ``` PASS B1 h3 字号 20px [实测 20] PASS B2 h3 字重 600 [实测 600] PASS B3 h3 左竖线 3px [3px rgb(0, 162, 255)] PASS B4 h3 底细线 1px [实测 1] PASS B5 h3 无背景色 [rgba(0, 0, 0, 0)] PASS C1 h3 比正文大 ≥4px [20 vs 16] PASS C2 h3 字重差 ≥200 [600 vs 350] PASS D1 h4 字号 17px [实测 17] PASS D2 h4 字重 600 [实测 600] PASS D3 层级递进：p < h4 < h3 [16 < 17 < 20] PASS D4 h4 无装饰 PASS D5 h2 原样式未动 [5px / 20px] PASS D6 h2 灰底仍在 [rgba(243, 243, 243, 0.7)] PASS F1 归档年份无左竖线 [bl=0] PASS F2 归档年份无自身下边框 [bb=0] PASS F3 .ar-head 底边线仍 1px [bb=1] PASS F4 归档年份仍 26px [实测 26] PASS F5 归档年份仍 700 [实测 700] PASS F6 归档年份 margin 仍清零 [0/0] PASS F7 归档年份 padding-left 已清零 [pl=0] ``` 反证 **10 / 10 全部抓到**： | 注入 | 预期 | 实测 | |---|---|---| | h3 字号 20→18px | 退回改前 | 50/2 ✅ | | h3 字重 600→500 | 区分度不足 | 50/2 ✅ | | h3 竖线 3px→0 | 唯一装饰没了 | 51/1 ✅ | | h4 17→16px | 层级断层 | 50/2 ✅ | | 删掉 h3.ar-year 让路规则 | 归档页多一条线 | 49/3 ✅ | | **阴性对照**：加无关规则 | 不该报红 | 52/0 ✅ | ### 已上线 ``` https://yangyq.net/theme-update/update.json {"version":"3.2.60", "md5":"6b6c5ff1bdb9be2373801a59d71fdec7"} ``` - zip 与本地字节一致，重复打包 md5 相同 - readme 已并入 3.2.60 节，历史 50 段完整保留 - transient 已清，后台可立刻看到 3.2.60 ⚠️ **服务器主题目录仍是 3.2.59**（红线：只发 zip，不解包覆盖）。需要你在后台点一次升级，我再补确认。

laoyang commented

2026-10-27 23:36:33 +00:00

追加：3.2.60 存在层级倒挂，3.2.61 修正（用户反馈）

用户反馈

「还是有点问题。现在你查一下 H3 和 H2 的字体大小对比，我怎么觉得现在 H3 比 H2 的字体还大了呢，而且还加粗了，有一点很莫名其妙。」

用户判断是对的。 线上 3.2.60 实测（真实页面 + 注入对照标题，桌面 1440）：

级别	字号	字重
h2	20px	500
h3	20px	600
h4	17px	600
正文	16px	350

h2 与 h3 同字号，h3 还粗 100。 三级标题比二级标题更抢眼 —— 层级倒挂。

我的错在哪

3.2.60 我只把 h3 从 18px/500 提到 20px/600，h2 一直是 20px/500，我压根没动。
等于让 h3 追平了 h2 的字号、还超过了字重。

更该反省的是判据：3.2.60 写了 52 条断言、全绿，但没有任何一条断言 h2 > h3。
当时只写 h3 > p（确认有区分度），没写「相邻两级的上下行关系」。所以倒挂在
52 条全绿里完全隐形。这是判据设计缺陷，不是实现难度问题。

用户选定的方案（追问后确认 D + h4 一起调）

四个候选方案已渲染成图供用户对比：A 现状（倒挂）/ B（h2 24/700、h3 20/500）/
C（h2 22/600、h3 20/700）/ D（h2 24/700、h3 20/600）。用户选 D，并要求 h4 一起调整。

3.2.61 定稿

h2  24px / 700 / 左 5px 蓝条 + 浅灰底（行高 41→46）
h3  20px / 600 / 左 3px 蓝条 + 底 1px 细线，无底色
h4  17px / 500 / 纯文字，无装饰
p   16px / 350

h4 从 600 降到 500 的理由：600 与 h3 完全同重，等于只有 3px 字号差，看着像
"同一级被缩小"而不是下一级。降到 500 让字重也参与分层；500 仍明显重于正文的
350（差 150），不会糊回正文。

h2 行高 41→46：24px 字配 41px 行高，灰底上下各只剩 8.5px、看着发扁。
46px 让上下各留约 11~12px，与 3.2.60 的 20px/41px 留白一致。

立下的两条铁律（写进 site.css 注释）

字号与字重必须同时严格递减：24>20>17>16、700>600>500>350
装饰强度也必须递减：蓝条+灰底 > 蓝条+细线 > 无 > 无

任一级调了，必须回头核对相邻两级的下行关系，不能只盯自己那一级。

判据：新增 G 组（本轮核心）

_geom361_route.js 56 / 0，双端面（桌面 1440 / 手机 390）。新增断言：

G1 h2 字号 > h3 字号            [24 > 20（差 4px）]
G2 h2 字重 > h3 字重            [700 > 600（差 100）]
G3 h3 字号 > h4 字号            [20 > 17（差 3px）]
G4 h3 字重 > h4 字重            [600 > 500（差 100）]
G5 h4 字号 > 正文字号            [17 > 16]
G6 h4 字重 > 正文字重            [500 > 350（差 150）]
G7 字号链严格递减（无相等平台）   [24 > 20 > 17 > 16]
G8 字重链严格递减（无相等平台）   [700 > 600 > 500 > 350]
H1~H5 装饰强度递减（5px 蓝条+灰底 > 3px 蓝条+1px 底线 > 无）
I1 h2 行高 ≥ 字号 ×1.75          [46 ≥ 42]

G7/G8 是「严格递减」—— 不允许相等。只写 >= 的话，"h2 和 h3 同为 20px"
照样能过，那正是 3.2.60 的病。

反证 10/10 —— 关键是 R1

_falsify361.js 的结果，第一项就是把我上一版的错原样注入：

注入	预计	实测
R1 整份 CSS 退回 3.2.60（h2 20/500、h3 20/600）	G1/G2 必须红	56→40，红 16 条，G1/G2 命中 ✅
R2 只把 h2 字号改回 20px	字号链出平台期	50/6 ✅
R3 只把 h2 字重改回 500	h3 更粗	50/6 ✅
R4 h2 字重设 600（与 h3 同重）	字重链平台期	50/6 ✅
R5 h4 字重回 600	G4 + A6	50/6 ✅
R6 h4 字重降到 350	G6 糊回正文	50/6 ✅
R7 h4 字号压到 16px	G5 与正文同大	52/4 ✅
R8 h2 行高退回 41px	I1 压扁	54/2 ✅
R9 h3 蓝条加宽到 5px	H5 装饰不递减	52/4 ✅
N1 阴性对照（加无关规则）	不报红	56/0 ✅

R1 通过才是本轮的关键：它证明我新写的 G 组能把上一版线上的真实错误抓出来。
上一轮"52 条全绿却漏了倒挂"的盲区，到此堵住。

顺带一个：_css360_selfcheck.js 在这次改动后主动报红了
（「声明齐全：h4 17px/600 → 缺 font-weight: 600」），因为它的硬期望还停在旧值。
说明那个自检是真在检查，更新期望后 28/0。

CSS 语法自检 28/0

花括号/圆括号配平、注释 11 开 11 闭
浏览器 replaceSync 逐块重插 17 块全部可重插（无一条被静默丢弃）
h2 的 font-weight:700 被浏览器真解析为 700、font-size:24px 真解析为 24px

## 追加：3.2.60 存在层级倒挂，3.2.61 修正（用户反馈） ### 用户反馈 > 「还是有点问题。现在你查一下 H3 和 H2 的字体大小对比，我怎么觉得现在 H3 比 H2 的字体还大了呢，而且还加粗了，有一点很莫名其妙。」 **用户判断是对的。** 线上 3.2.60 实测（真实页面 + 注入对照标题，桌面 1440）： | 级别 | 字号 | 字重 | |---|---|---| | h2 | **20px** | **500** | | h3 | **20px** | **600** | | h4 | 17px | 600 | | 正文 | 16px | 350 | **h2 与 h3 同字号，h3 还粗 100。** 三级标题比二级标题更抢眼 —— 层级倒挂。 ### 我的错在哪 3.2.60 我只把 h3 从 18px/500 提到 20px/600，**h2 一直是 20px/500，我压根没动**。等于让 h3 追平了 h2 的字号、还超过了字重。 **更该反省的是判据**：3.2.60 写了 52 条断言、全绿，但**没有任何一条断言 `h2 > h3`**。当时只写 `h3 > p`（确认有区分度），**没写「相邻两级的上下行关系」**。所以倒挂在 52 条全绿里完全隐形。这是判据设计缺陷，不是实现难度问题。 ### 用户选定的方案（追问后确认 D + h4 一起调）四个候选方案已渲染成图供用户对比：A 现状（倒挂）/ B（h2 24/700、h3 20/500）/ C（h2 22/600、h3 20/700）/ D（h2 24/700、h3 20/600）。用户选 **D**，并要求 h4 一起调整。 ### 3.2.61 定稿 ``` h2 24px / 700 / 左 5px 蓝条 + 浅灰底（行高 41→46） h3 20px / 600 / 左 3px 蓝条 + 底 1px 细线，无底色 h4 17px / 500 / 纯文字，无装饰 p 16px / 350 ``` **h4 从 600 降到 500 的理由**：600 与 h3 完全同重，等于只有 3px 字号差，看着像 "同一级被缩小"而不是下一级。降到 500 让字重也参与分层；500 仍明显重于正文的 350（差 150），不会糊回正文。 **h2 行高 41→46**：24px 字配 41px 行高，灰底上下各只剩 8.5px、看着发扁。 46px 让上下各留约 11~12px，与 3.2.60 的 20px/41px 留白一致。 ### 立下的两条铁律（写进 site.css 注释） 1. **字号与字重必须同时严格递减**：24>20>17>16、700>600>500>350 2. **装饰强度也必须递减**：蓝条+灰底 > 蓝条+细线 > 无 > 无任一级调了，必须回头核对相邻两级的下行关系，不能只盯自己那一级。 ### 判据：新增 G 组（本轮核心） `_geom361_route.js` **56 / 0**，双端面（桌面 1440 / 手机 390）。新增断言： ``` G1 h2 字号 > h3 字号 [24 > 20（差 4px）] G2 h2 字重 > h3 字重 [700 > 600（差 100）] G3 h3 字号 > h4 字号 [20 > 17（差 3px）] G4 h3 字重 > h4 字重 [600 > 500（差 100）] G5 h4 字号 > 正文字号 [17 > 16] G6 h4 字重 > 正文字重 [500 > 350（差 150）] G7 字号链严格递减（无相等平台） [24 > 20 > 17 > 16] G8 字重链严格递减（无相等平台） [700 > 600 > 500 > 350] H1~H5 装饰强度递减（5px 蓝条+灰底 > 3px 蓝条+1px 底线 > 无） I1 h2 行高 ≥ 字号 ×1.75 [46 ≥ 42] ``` `G7`/`G8` 是「**严格**递减」—— 不允许相等。只写 `>=` 的话，"h2 和 h3 同为 20px" 照样能过，那正是 3.2.60 的病。 ### 反证 10/10 —— 关键是 R1 `_falsify361.js` 的结果，**第一项就是把我上一版的错原样注入**： | 注入 | 预计 | 实测 | |---|---|---| | **R1 整份 CSS 退回 3.2.60（h2 20/500、h3 20/600）** | **G1/G2 必须红** | **56→40，红 16 条，G1/G2 命中** ✅ | | R2 只把 h2 字号改回 20px | 字号链出平台期 | 50/6 ✅ | | R3 只把 h2 字重改回 500 | h3 更粗 | 50/6 ✅ | | R4 h2 字重设 600（与 h3 同重） | 字重链平台期 | 50/6 ✅ | | R5 h4 字重回 600 | G4 + A6 | 50/6 ✅ | | R6 h4 字重降到 350 | G6 糊回正文 | 50/6 ✅ | | R7 h4 字号压到 16px | G5 与正文同大 | 52/4 ✅ | | R8 h2 行高退回 41px | I1 压扁 | 54/2 ✅ | | R9 h3 蓝条加宽到 5px | H5 装饰不递减 | 52/4 ✅ | | N1 阴性对照（加无关规则） | 不报红 | 56/0 ✅ | **R1 通过才是本轮的关键**：它证明我新写的 G 组能把上一版线上的真实错误抓出来。上一轮"52 条全绿却漏了倒挂"的盲区，到此堵住。顺带一个：`_css360_selfcheck.js` 在这次改动后**主动报红**了（「声明齐全：h4 17px/600 → 缺 font-weight: 600」），因为它的硬期望还停在旧值。说明那个自检是真在检查，更新期望后 **28/0**。 ### CSS 语法自检 28/0 - 花括号/圆括号配平、注释 11 开 11 闭 - 浏览器 `replaceSync` 逐块重插 **17 块全部可重插**（无一条被静默丢弃） - h2 的 `font-weight:700` 被浏览器真解析为 700、`font-size:24px` 真解析为 24px

laoyang referenced this issue from a commit

2026-10-27 23:38:14 +00:00

3.2.61 修 h2/h3 层级倒挂：h2 提到 24/700，h4 降到 500 参与分层 #29

laoyang commented

2026-10-28 01:36:02 +00:00

用户已验收通过，关单

线上已确认生效（探测到 kratos.min.css?ver=3.2.64、site.css?ver=3.2.64）。

本单修的是「正文 h3/h4 与正文区分度太低」。3.2.61 落地：
h2 提到 24/700 + 灰底蓝条，h3 20/600 + 左侧 3px 竖线 + 底部细线，h4 降到 500 参与分层。

判据不只是看"有没有加样式"，而是判相邻两级标题之间的差异（pitfalls #466：
只判"每级 vs 正文"会漏掉层级倒挂），且用严格 > 而非 >=。

用户已在上线后验收通过。按用户要求关闭。

## 用户已验收通过，关单线上已确认生效（探测到 `kratos.min.css?ver=3.2.64`、`site.css?ver=3.2.64`）。本单修的是「正文 h3/h4 与正文区分度太低」。3.2.61 落地： h2 提到 24/700 + 灰底蓝条，h3 20/600 + 左侧 3px 竖线 + 底部细线，h4 降到 500 参与分层。判据不只是看"有没有加样式"，而是判**相邻两级标题之间**的差异（pitfalls #466：只判"每级 vs 正文"会漏掉层级倒挂），且用严格 `>` 而非 `>=`。用户已在上线后验收通过。按用户要求关闭。

laoyang closed this issue

2026-10-28 01:36:02 +00:00

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: laoyang/wordpress-kratos-yang#29

正文 h3/h4 与正文区分度太低，需增加样式 #29

现象

已实测确认现状（线上真实计算样式）

用户选定的风格

要做的改动

验收标准

涉及文件（预估）

为什么单独建单

已发布 3.2.60（commit cca7497）

改了什么

改之前的实测值

改后的层级梯度

两个「顺手会踩坏别处」的地方（都验过）

验证结果

已上线

追加：3.2.60 存在层级倒挂，3.2.61 修正（用户反馈）

用户反馈

我的错在哪

用户选定的方案（追问后确认 D + h4 一起调）

3.2.61 定稿

立下的两条铁律（写进 site.css 注释）

判据：新增 G 组（本轮核心）

反证 10/10 —— 关键是 R1

CSS 语法自检 28/0

用户已验收通过，关单

已发布 3.2.60（commit `cca7497`）