会，text-shadow模拟加粗因软边阴影导致文字模糊，尤其小字号或retina屏；需设blur-radius为0，用多方向1px硬边阴影（如-1px 0 0, 1px 0 0等）并启用gpu加速。
text-shadow模拟加粗会导致文字模糊？
会，尤其在小字号或Retina屏上明显。本质是用多个偏移的阴影叠加“撑开”笔画，但阴影是软边，不是矢量加粗，边缘必然发虚。
- 只对
font-weight: normal且无原生加粗支持的字体有效（比如某些自定义Web Font） -
text-shadow的blur-radius必须为0，否则模糊加剧；常用组合是0 0 1px多方向叠加 - 横向叠加（如
-1px 0 0,1px 0 0）比纵向更安全，避免行高意外变化
真正不改变宽度的加粗方案有哪些？
纯CSS里，font-weight 改变通常伴随字宽变化（尤其非等宽字体），想“视觉加粗但占位不变”，只有两个靠谱路径：
- 用支持
font-variation-settings的可变字体，调'wght'轴：例如font-variation-settings: 'wght' 700;—— 这是字体自身设计的连续加粗，宽度几乎不变 - 用 SVG 文本 +
stroke：把文字转成<text></text>，设fill: none和stroke: currentColor，再通过stroke-width控制粗细 —— 完全可控，但丧失文本可选、可搜、可缩放优势 - 放弃“完全不改变宽度”的执念：现代浏览器对
font-weight的渲染已优化很多，多数场景下600或700带来的宽度浮动在1px内，肉眼难辨
为什么 font-weight: bold 不总等于 font-weight: 700？
因为 bold 是关键字，浏览器会按字体族中“最接近bold的可用字重”映射，不一定对应数值700。比如某字体只提供400和900两档，font-weight: bold 就会落到900，而 font-weight: 700 可能被降级到400（或插值模拟）。
- 查字体实际支持的字重：用浏览器开发者工具的“Computed”面板看
font-weight最终计算值 - 用
@font-face显式声明每个字重的font-weight值，避免浏览器猜错 - 慎用
font-weight: bolder/lighter：依赖父元素字重，行为不可控
text-shadow 加粗的实操写法（最小副作用）
如果必须用 text-shadow，以下写法兼顾清晰度与宽度稳定：
strong {
text-shadow:
-1px 0 0 currentColor,
1px 0 0 currentColor,
0 -1px 0 currentColor,
0 1px 0 currentColor;
}
- 四个方向各1px硬边阴影，不模糊，不增加行高
- 避免用
0 0 1px：它在所有方向扩散，实际加粗不均匀且易糊 - 别叠加超过4个阴影：性能下降，且在低配设备上可能触发渲染降级
- 务必配合
transform: translateZ(0)或will-change: transform强制GPU加速，减少闪烁
font-weight 的表现差异常被忽略。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
