给输入框加提示文字，最直接的就是用 placeholder 属性。它支持 text、email、search、tel、url 这些类型，但 password 不行——部分旧浏览器会直接忽略。另外提示文字不能换行，也不能塞 HTML 标签进去。
别把提示写成 value
有人图省事把提示文字写在 value 里，结果一刷新页面就成了默认值，提交时还可能被一并带走。这不是提示，是脏数据。正确做法就是老老实实写 placeholder：
<input type="text" placeholder="请输入用户名">placeholder 颜色太浅，怎么改？
浏览器默认的 placeholder 是浅灰色，有些设计稿要求更暗或者带品牌色，这时候得用 CSS 伪元素覆盖。不同浏览器前缀不一样，漏掉哪个都可能不生效：
input::placeholder { color: #666; font-size: 14px; }
input::-moz-placeholder { color: #666; }
input::-webkit-input-placeholder { color: #666; }Chrome/Edge/Opera 用 ::placeholder，Firefox 用 ::-moz-placeholder，Safari 新版已经统一，但 iOS Safari 旧版本还得测。
需要一直显示的提示，用 label 还是 title？
title 那个是鼠标悬停才出来的 tooltip，根本不是表单提示的正经方案。正解是 <label>，配合 for 和 id 关联输入框，语义化、可访问性都没问题，而且点击 label 还能聚焦到输入框。
<label for="user">用户名</label>
<input type="text" id="user" name="user">也可以把 input 直接包在 label 里，省掉 id/for，不过复杂布局的时候这么干不太灵活。千万别只靠视觉位置对齐——屏幕阅读器靠的是 label 关联，没有的话视障用户根本不知道这输入框是干嘛的。
iOS Safari 里 placeholder 不显示？
老版本 iOS Safari（尤其是 12 之前）有个渲染 bug：输入框设了 padding 或 line-height 之后，placeholder 文字会偏移、截断，甚至完全不显示。
优先用 padding 控制内边距，别用 height + line-height 去撑高输入框。如果用了 flex 或者绝对定位，检查一下是不是不小心把 placeholder 区域给盖住了。真碰上兼容问题，可以用 JS 做个兜底，但别拿它替代原生 placeholder。
多语言场景下的麻烦
真正麻烦的是多语言切换——placeholder 不会跟着 locale 自动变，得靠 JS 动态改属性值。这种时候，用 label 反而比 placeholder 更可控，至少文案管理更集中。
