initial-letter应直接弃用，因Chrome、Firefox、Android WebView根本不解析该属性；唯一跨浏览器方案是::first-letter配合float:left、line-height:0.75和clamp()响应式font-size，并确保HTML结构纯净、容器为块级且非flex/grid。
别修复，直接弃用 initial-letter——它在 Chrome、Firefox、Android WebView 中压根不解析，不是兼容性问题，是浏览器根本不认这个属性。
为什么 initial-letter 在非 Safari 浏览器里完全不生效
这不是写法错误或漏了 vendor prefix，而是标准实现缺失：initial-letter 目前仅 Safari 16.4+ 原生支持；Chrome 119+ 需手动开启 chrome://flags/#enable-experimental-web-platform-features；Firefox 官方标记为「No support」；Android WebView（含微信、QQ、支付宝）无任何响应。你写的 initial-letter: 3 在这些环境里会被 CSS 解析器直接跳过，getComputedStyle(p).initialLetter 返回空字符串，DevTools 的 computed 样式面板里根本不会出现该属性。
::first-letter + float: left 是唯一跨浏览器稳定方案
这不是降级，是当前唯一被所有主流引擎（WebKit/Blink/Gecko）稳定支持的路径，但必须配齐三要素：
-
float: left：唯一能触发文字环绕的属性；不加它，首字只是变大，后续文字不会绕排 -
line-height: 0.75：必须显式写，且不能带单位；继承父级line-height: 1.6会让放大后的首字撑开整行，第二行直接被顶到下方 -
font-size: clamp(2.5rem, 4vw, 3.5rem)：固定值至少2.5em；2em在多数中文字体下视觉下沉感极弱
父容器必须是块级且未设 display: flex 或 display: grid，否则伪元素静默失效；HTML 中首字符前不能有换行、空格、注释或内联标签（如 <p><strong>今</strong>天…</p> 里的 ::first-letter 选不到“今”）。
立即学习“前端免费学习笔记（深入）”；
中文段落以标点开头时 ::first-letter 选错字怎么办
这不是 bug，是规范行为：::first-letter 匹配的是 Unicode 字母类（Letter）的第一个字符，而中文引号“、书名号《、括号（等属于 Punctuation 类，部分浏览器会优先选中它们——结果就是标点被放大三倍，正文从第二行开始错位。
- 服务端或构建时用正则
/^[\u4e00-\u9fa5\w]/提取首汉字再包裹，HTML 变成<p><span class="dropcap">中</span>国人民…</p> - 若 CMS 输出不可控，前端 JS 检测首字符是否为标点，动态插入
<span>包裹首汉字 - 绝对不要依赖浏览器自动“吞并”标点——Chrome 和 Firefox 行为不一致，Firefox 更容易把全角引号整个吞掉
真正麻烦的不是怎么写样式，而是让首字在不同字体、不同缩放、不同 WebView 下都稳住位置：::first-letter 的不可控性会随中文字体字怀差异、fallback 字体切换、系统字体加载时机快速上升。
