如何解决HTML5 placeholder不显示问题？输入框提示修复技巧分享。

本文共计947个文字，预计阅读时间需要4分钟。

常见现象是：

• type="number"、type="date" 等控件在部分 Safari/iOS 版本中不支持 placeholder（尤其 iOS 15.4 之前）
• 给 div[contenteditable] 加 placeholder 没用——它不是表单控件，HTML 标准不定义该行为
• CSS 里写了 opacity: 0 或 visibility: hidden 到 input 本身，也会让 placeholder 一起不可见（哪怕你只对 value 做了隐藏）
• 用了自定义字体但未加载完成，某些浏览器会延迟渲染 placeholder 文字（表现为“闪一下就没了”）

怎么让 placeholder 在所有主流环境都稳住

别依赖 CSS 伪元素硬改，也别用 JS 模拟“占位文字”来覆盖原生逻辑——容易和 focus/blur、无障碍读屏冲突。最可靠的方式是守住两个前提：元素必须是原生可编辑表单控件，且未被样式或类型禁用语义。