Skip to content

Commit

Permalink
update pictures
Browse files Browse the repository at this point in the history
  • Loading branch information
afc163 committed Mar 14, 2016
1 parent 695a042 commit 4d7d49c
Show file tree
Hide file tree
Showing 2 changed files with 4 additions and 4 deletions.
6 changes: 3 additions & 3 deletions docs/spec/alignment.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,16 +12,16 @@

## 文案类对齐

<img class="preview-img" align="right" alt="推荐示例" description="标题和正文左对齐,使用了一个视觉起点。" good src="https://os.alipayobjects.com/rmsportal/halNrWDrYoFPYzC.png">
<img class="preview-img" align="right" alt="不推荐示例" description="标题和正文使用了两个视觉起点,不推荐该种对齐方式,除非刻意强调两者区别。" bad src="https://os.alipayobjects.com/rmsportal/WBHYfadyasYcEIN.png">
<img class="preview-img" align="right" alt="推荐示例" description="标题和正文左对齐,使用了一个视觉起点。" good src="https://os.alipayobjects.com/rmsportal/xvmiAZAIxrEcqdP.png">
<img class="preview-img" align="right" alt="不推荐示例" description="标题和正文使用了两个视觉起点,不推荐该种对齐方式,除非刻意强调两者区别。" bad src="https://os.alipayobjects.com/rmsportal/qvycImsTiDGVgLJ.png">

如果页面的字段或段落较短、较散时,需要确定一个统一的视觉起点。

---

## 表单类对齐

<img class="preview-img" noPadding align="right" alt="冒号对齐示例" src="https://os.alipayobjects.com/rmsportal/ZRZQGhrTKBJUJYd.png">
<img class="preview-img" noPadding align="right" alt="冒号对齐示例" src="https://os.alipayobjects.com/rmsportal/DmEbaUsrpJkRyUh.png">

冒号对齐(右对齐)能让内容锁定在一定范围内,让用户眼球顺着冒号的视觉流,就能找到所有填写项,从而提高填写效率。

Expand Down
2 changes: 1 addition & 1 deletion docs/spec/proximity.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@

## 纵向间距关系

<img class="preview-img" align="right" alt="纵向间距示例" description="在 Ant Design 中,这三种规格分别为:8px(小号间距)、16px(中号间距)、24px(大号间距)。" src="https://os.alipayobjects.com/rmsportal/clilcwkwtpZduHV.png">
<img class="preview-img" align="right" alt="纵向间距示例" description="在 Ant Design 中,这三种规格分别为:8px(小号间距)、16px(中号间距)、24px(大号间距)。" src="https://os.alipayobjects.com/rmsportal/blBCqHsUJhKxxAU.png">

通过『小号间距』、『中号间距』、『大号间距』这三种规格来划分信息层次。

Expand Down

0 comments on commit 4d7d49c

Please sign in to comment.