在混合开发项目中，iOS端的WKWebView承载着大量H5页面渲染任务，但不少开发者发现，网页里设置的加粗样式在真机上毫无作用，文字依旧细瘦。这种现象背后涉及系统字体机制、CSS规范映射以及字体文件加载流程多个环节。
一、CSS font-weight在WKWebView中的映射逻辑
CSS的font-weight属性并不只是bold和normal两个选项，它实际上是一组从100到900的数值体系。按照规范，400对应normal，700对应bold，而100到300为细体，500到600为中等，800到900为特粗。但在iOS系统中，系统自带字体（如苹方PingFang SC）并不会为每一个数值都准备独立字重文件。
WKWebView在解析网页样式时，会依据可用字体资源做就近匹配。如果你写了font-weight:550，而系统中只有400和600两档，那么渲染引擎可能直接回退到400，导致视觉上完全没有加粗效果。很多开发者习惯写font-weight:bold以为万无一失，但若网页指定的字体族在iOS上缺失bold对应文件，同样会失效。
常见数值与系统支持对照
| CSS数值 | 语义 | 苹方字体支持情况 |
|---|---|---|
| 100-300 | 细体 | 仅UltraLight、Thin、Light档 |
| 400 | 常规 | Regular完整支持 |
| 500-600 | 中等 | Medium、Semibold支持 |
| 700 | 加粗 | Bold支持 |
| 800-900 | 特粗 | 无独立文件，就近取Bold |
从表中可以看出，若想稳定加粗，最保险的做法是使用500、600或700这类系统明确提供支持的字重值，并配合正确的字体族名称。避免使用非标准的中间值，能减少映射偏差。
二、系统字体与自定义字体的加载差异
系统字体由iOS统一托管，WKWebView可通过font-family直接调用PingFang SC等内置字体，其字重档位受系统版本影响较小。但自定义字体则完全不同，需要开发者在App资源中放入字体文件，并在CSS里用@font-face声明，否则网页根本找不到对应字体，更谈不上字重切换。
实践中，常有团队把字体文件放进工程，却忘记在Info.plist中注册Fonts provided by application，或者H5的@font-face路径写错，导致字体加载失败。此时浏览器会回退到默认字体，而默认字体若没有bold文件，加粗自然消失。自定义字体如果只导出了Regular单字重，却在CSS里写font-weight:700，也会因为缺少Bold文件而无效。
正确嵌入自定义字体的步骤
- 将字体文件如MyFont-Bold.otf加入Xcode项目，确认Target Membership勾选App
- 在Info.plist添加字体声明，列出所有字重文件名
- 在网页CSS中用@font-face分别定义normal和bold的来源文件
- 正文使用font-family:MyFont，并通过font-weight切换字重
只有上述环节全部打通，WKWebView才能按预期渲染加粗文字。建议开发阶段用Safari远程调试功能检查字体加载状态，确认Network面板里字体文件返回200。
三、实战排查与修复方案
遇到加粗失效，先确认元素最终计算样式。通过Safari连接真机，查看Computed面板里font-weight与font-family值，若font-family回退成Times或系统默认，说明自定义字体未生效。此时应优先修正字体加载，而非反复调整字重数值。
如果字体族正确但仍不加粗，可尝试把样式改写为font-weight:600，并显式声明font-family:"PingFang SC"。对于自定义字体，确保Bold文件独立存在且@font-face的font-weight描述与使用时一致。部分团队用字体转换工具只生成了subset的Regular，漏掉Bold，这种隐性缺失只有真机才能暴露。
核心原则：WKWebView的加粗问题，九成以上源于字体资源缺失或字重映射越界，而非CSS写法错误。
最后，避免在CSS中使用font-synthesis: none之类禁用合成加粗的属性，否则即便系统能模拟粗体也会被强制关闭。保持默认合成开启，在低优先级页面可临时用text-shadow模拟加粗作为兜底，但长期方案仍是补齐字重文件。
四、总结建议
解决iOS端WKWebView字体加粗失效，需要从CSS规范、系统字体机制与自定义字体打包三个维度同步排查。开发时统一字重取值标准，规范字体文件引入流程，就能从根本上消除此类兼容问题，保障H5内容在iOS上视觉还原度。
WKWebView_font-weightiOS字体加粗自定义字体加载修改时间：2026-08-10 16:00:57