表单标签怎么做：不要只靠输入框占位文字说明用途
用户输入后占位提示会消失，复杂表单容易填错。本文介绍label与输入框关联、错误提示保留以及键盘操作检查方法。
输入以后仍应知道这一栏是什么
表单标签怎么做，关键是让字段名称始终可见，并与真正的输入控件关联。placeholder适合提供示例，不适合作为唯一字段说明。用户开始输入后，占位文字消失，返回修改时就可能忘记这一栏需要什么内容。
HTML可用label的for对应输入框的id，且id在页面内应唯一。点击标签应让对应控件获得焦点，这也有利于触屏操作与辅助技术理解字段。组件重复出现时，要检查生成的id是否冲突，不能复制同一段标记到十行表单后继续沿用相同编号。
错误提示与内容一起保留
为必填项、格式限制和示例提供简短说明，错误发生后显示在对应字段附近。不要仅用红色边框表达错误，也不要清空其他已经填写的内容。提交失败时，用户应知道哪一项需要改、为什么需要改，以及原有信息是否还在。
验收用鼠标点击标签、用Tab切换控件，再尝试只靠键盘完成表单。检查视觉顺序与焦点顺序是否一致，错误文字能否被辅助技术关联理解。登录、搜索和文章编辑页都应使用相同规则。标签完善不能替代服务端校验，但能减少无意义的错误提交，让用户更容易一次完成任务。
官方参考
资料核对日期：2026年10月26日。
本文新增价值
用户输入后占位提示会消失，复杂表单容易填错。本文介绍label与输入框关联、错误提示保留以及键盘操作检查方法。本文补充适用边界、输入对照与验收方法；操作建议为综合整理，未将官方示例当成本网站实测结果。
用户输入后占位提示会消失，复杂表单容易填错。本文介绍label与输入框关联、错误提示保留以及键盘操作检查方法。本文补充适用边界、输入对照与验收方法；操作建议为综合整理，未将官方示例当成本网站实测结果。