表单设计是一个复杂的任务，你得把它拆开来看。给表单打好基础，结构、布局和容错性都得考虑周全。先从标签、输入框和按钮开始说起。任何一张B端表单，都能拆分成这三块最基本的部分。 标签的作用是告诉用户这个字段填什么，输入框用来收集信息，而按钮把用户引导到下一步或确认页。这三块积木搭稳了，后续的优化才有基础。 接下来聊聊标签的对齐方式。PC端通常用左标签的方式，这样视觉重心不会偏移。当字段名称很长或者数量不多的时候，可以考虑用顶标签的方式展示标题，避免折行带来的阅读问题。 对于一些简短的输入场景，比如登录、注册等，行内标签就很适合了，用户点击后提示就会消失。不过要小心别遮盖提示信息。 输入框的设计别偷懒！很多新手为了省事把所有输入框都设计成文本框。但这样会导致体验直线下降。正确的做法是根据字段语义选择合适的组件：密码用密码框，邮箱用邮箱组件，多行内容用多行文本框。Ant Design提供了不同高度的输入框选项，但真正的标尺是“用户最多能输入多少字”。比如收货地址的宽度应该比电话号码宽出一倍以上。 按钮布局也很重要。按照古腾堡法则来安排按钮位置吧。主操作按钮放在右下角，次操作按钮放在左上角。还可以通过颜色、大小和动效来区分主次。 表单的布局也需要仔细思考一下。字段少的时候选择单列布局，从上到下填写；复杂的表单可以选择多列布局或者区域分组的方式来进行分区。 一些小细节也不能忽视。提示语要放在显眼位置，提交结果要秒反馈成功或者失败的信息。系统还可以帮用户补齐后缀或者去掉横杠等容错操作。 必填项标记也很重要，“星号✘文本提示”双保险既不会抢色又不会漏掉。 最后一个细节就是错误提示了，“贴脸输出”才有效。比如手机号少一位数的时候光标离开即出现红色下划线和错误原因文案。 表单设计没有万能公式，只有对症下药才行。把这篇避坑指南折在笔记本第一页，下一次画表单时就少踩一个坑吧！在B端世界里，时间就是金钱。