.card-title{font-size:16px} /* 字号归样式 */
<h2>常见问题</h2>
<h3 class='card-title'>运费怎么算</h3>
侧栏模块标题用 h4,上一级区块是 h2,中间没有 h3,读屏按标题键跳转时层级从二级直接掉到四级,用户以为漏读了一整段。这类现象通常不是突然出现的,往前翻半天日志能看到苗头。
追下去是这么回事:标题级别是按字号选的,不是按结构选的,中间层被跳过。读屏和辅助工具依赖连续的级别判断内容从属关系,断档后大纲就乱了。
「标题层级跳跃」排查到最后往往是很小的一处差异,前面那些复杂猜测可以先放一放。同类问题如果隔一段时间又出现,多半是某个定时任务或重启流程把改动冲掉了。
把这次用到的命令存进笔记,比记住结论有用,换个环境还能照着走。
处理上按这个顺序:按内容层级重排标题,父级用 h2,子级就用 h3,别为了字号跳级;字号在样式里单独控制,标题级别只表达结构;改完用浏览器的大纲视图或检测插件过一遍,确认没有跳级。
确认没问题再收工,标题导航从一级到六级连续下降,检测工具不再报 heading-order 违规。
