表单元素的对齐模式

表单元素的对齐方式
摘自《web表单设计-点石成金的艺术》

1. 标签顶对齐（即上标签下输入框）
a.好处：用户眼睛只需从上往下移动，这样可以快速完成表单
b.坏处：占用多过垂直空间，导到用户需要向下滚轮

2. 左标签右输入框，标签右对齐
a.好处：由于标签右对齐，存在一条虚拟的中间线；所以用户眼球基本上仍只需从上往下移，完成表单速度仍然较快
b.坏处：标签没有左对齐，不利于快速读完标签内容（因为人们习惯读左对齐的文本）；当一个标签本身要占两行时，这个问题更严重

3. 左标签右输入框，标签左对齐
a.好处：可以快速读完标签内容
b.好处：用户的眼球既要上下滚，又要左右滚，影响表单填写速度

4. 标签以灰色字体放在文本框里作为提示
a.好处：非常节省空间
b.坏处：缺乏始终在场的指导，对健忘的人不利

附作者提供的最佳实践：
表单元素的对齐模式