通过CSS的::placeholder伪元素可自定义输入框提示文字颜色、字体和透明度，建议使用#999等高对比度颜色并设置opacity:1以提升可读性和无障碍体验，同时兼容各浏览器需添加厂商前缀。
输入框的 placeholder 提示文字默认颜色较淡，可能影响可读性，尤其在低亮度环境下。通过 CSS 的 ::placeholder 伪元素可以轻松自定义样式，包括颜色、字体、透明度等。
使用 ::placeholder 伪类调整提示文字
直接为 input 或 textarea 元素添加 ::placeholder 样式规则即可修改提示文字外观：
input::placeholder {
color: #999;
font-size: 14px;
opacity: 1; /* 防止某些浏览器降低透明度 */
}
兼容不同浏览器
为了确保在各类浏览器中都能正常显示，建议加上厂商前缀：
input::-webkit-input-placeholder { color: #999; }
input::-moz-placeholder { color: #999; }
input::-ms-input-placeholder { color: #999; }
input::placeholder { color: #999; }
现代项目中可仅使用标准语法 ::placeholder，除非需支持较老版本 IE。
立即学习“前端免费学习笔记（深入）”；
提升可访问性和用户体验
提示文字不宜过浅，推荐使用至少 4.5:1 的对比度以符合无障碍标准。避免使用纯灰或透明度过低的颜色。
- 颜色建议：#888、#777 或品牌辅助色
- 设置 opacity: 1 防止默认半透明效果叠加导致文字太淡
- 可配合字体大小和字重提升辨识度
基本上就这些，合理设置 placeholder 样式能显著改善表单体验。
