iPhone SE 上 label 文字模糊挤成一团，根本原因是布局未响应式断行、行高不足、CSS 缩放干扰，而非 DPI 或字体大小问题。

窄屏下 label 文字模糊、挤成一团、点击区域小——根本不是字体没放大，而是布局没断开、行高没撑开、缩放被干扰。

label 在 iPhone SE 上文字糊成一块怎么办

这不是 DPI 问题，是浏览器在小屏上对 font-size

• 所有 label 必须设 font-size: 16px 或更大，别信“14px 看着也清楚”，它会触发缩放
• 别给 label 加 transform: scale(0.9) 或 zoom，这些会让文本渲染降级
• 确保 viewport meta 没禁用缩放：<meta name="viewport" content="width=device-width, initial-scale=1">，user-scalable=no 已被 iOS 忽略且损害可访问性

小屏下 label 和 input 堆叠后文字折行、截断

横向并排的 label+input 切到垂直堆叠时，如果 label 没清掉原来的 margin-right 或 white-space: nowrap，就会在窄屏下文字强行换行、甚至被截断。

• 窄屏媒体查询里必须重置 label 的宽度和间距：label { min-width: auto; margin-right: 0; }
• 长 label 文字（如“请填写您在本平台注册时使用的手机号”）要加 word-break: break-word，别用 overflow: hidden 直接砍掉
• 如果 label 含图标或 badge，用 display: flex; align-items: flex-start 防止基线错位导致文字上浮

为什么加了 font-size 还是看不清？检查这三处

光调大字号不够，label 的可读性还卡在三个隐性环节上：

CSS婚礼策划服务机构宣传网站模板

CSS婚礼策划服务机构宣传网站模板是一款适合提供婚礼策划和婚庆服务机构宣传网站模板下载。提示：本模板调用到谷歌字体库，可能会出现页面打开比较缓慢。

下载

立即学习“前端免费学习笔记（深入）”；

• line-height 小于 font-size：至少设为 1.4，否则多行文字粘连
• color 对比度不足：用 color: #333 或更暗，别用 #666，WCAG AA 要求文本对比度 ≥ 4.5:1
• 父容器有 transform: translateZ(0) 或 will-change: transform：某些 Android WebView 下会导致 subpixel 渲染失效，文字发虚，去掉再试

最常被忽略的是：label 不是独立元素，它的清晰度依赖于和 input 共享的视觉节奏——行高、间距、对齐方式必须同步调整，而不是只改一个地方就以为搞定。