From 57a6535a4c596a61949d753ae4caa9ff1557db44 Mon Sep 17 00:00:00 2001 From: afc163 Date: Tue, 12 Jan 2016 14:12:21 +0800 Subject: [PATCH] upgrade pattern form.md --- docs/pattern/form.md | 56 +++++++++++++++++++++++++++++++++++++++----- 1 file changed, 50 insertions(+), 6 deletions(-) diff --git a/docs/pattern/form.md b/docs/pattern/form.md index 138c2cbb23..a0eece9a04 100644 --- a/docs/pattern/form.md +++ b/docs/pattern/form.md @@ -106,16 +106,60 @@ ### 字数校验框 -字数校验框示例 +字数校验框示例 用于统计当前输入长度，以及是否超过系统阈值。 -### 容错格式（敬请期待） -### 自动完成（敬请期待） +## 规格 -### 列表构造器（敬请期待） +### 间距 -### 良好的默认值（敬请期待） +间隔示例 -## 规格（敬请期待） +典型表单的间隔规范。 + +### 输入框宽度 + +正确示例 +错误示例 + +当内容可预知，可以根据内容长短进行定义其落在多少个栅格上。 + +
+ +### 对齐方式 + +间隔示例 + +无论左对齐、右对齐还是顶部对齐，都有其优缺点和应用场景，所以正确的解决方案取决于具体目标和制约因素，诸如：希望用户加快或者降低填写速度（有时设计者希望用户深思熟虑每个输入）、屏幕显示的限制、本地化考虑等多种因素。 + +
+ +右对齐（推荐） + +右对齐（推荐）。 + +- 优点：减少垂直空间。 +- 缺点：降低可读性；标签长度和输入框弹性小。 +- 场景：既要减少垂直空间，又要加快填写速度。 + +
+ +顶部对齐 + +顶部对齐。 + +- 优点：有最快的浏览和处理速度；标签长度弹性大。 +- 缺点：非常占垂直空间。 +- 场景：希望用户快速填写表单，完成任务。 + +
+ +左对齐 + +左对齐。 + +- 优点：容易浏览；减少垂直空间。 +- 缺点：填写速度慢；标签长度和输入框弹性小。 +- 场景：希望用户放慢速度，仔细思考表单中的每个输入框。