设计语言—表单（登录/注册）

看到这里水平登录也页的几个要点就讲完了，不是很难懂，同学们练习一下，根据例子实操练一下就明白了。

2.1垂直登录（样式）

现在最常用的登录样式是垂直登录，基本上所有后台和各大门户社交平台，均采用的是这种登录样式。例如新浪网、百度云盘、淘宝、京东等，例子太多了。不要看他们是大厂大公司，有些细节把控还是不到位的。例如新浪网的垂直登陆，文字与矩形框的距离没有规范，它们之间的距离太近了，视觉效果稍差一些，又或者是输入完信息后右面的清除按钮做的不规范，没有做到"视觉水平居中"等问题。

又或者京东的登录按钮的"输入区"、"忘记密码"、"登录区"之间的距离不应该是相同的，应该具有层级关系；登录按钮的字号和矩形框的关系不协调，给人一种很蠢的感觉。说的有点多了，这些都是非常微小的细节，希望同学们在做自己的项目时都思考并规避这些问题，才能给用户一种极致舒适的体验。

2.2垂直登录（大体结构）

垂直登录不像水平登录那样存在比例关系，输入区与登录区宽度相同就行了。但要注意的是，输入区与记忆区是同一个层次，所以它们之间的间距是相同的。而输入/记忆区与登录区的层次是不同的，所以它们之间要留有一定的间距。而且输入区与登录区层级不同，登录区的按钮高度应该设置的更大一些，来突出它的独立性。

2.3垂直登录（拆分要素）

垂直登录中的要素与水平登录中的要素基本相同，差异在于记忆区，所以只讲一下这里得了。记忆区很简单，只要把勾选框和文字之间的距离算出来就行了，就这么点事儿。另外垂直登录的宽度也是按照同学们的审美来决定的，只要不过长问题都不是很大。