初识

内容太多时，默认收起，点“展开”按钮展开看全文，点“收起”按钮恢复原状。
《设计元素12篇》这个系列里有一篇是“列表”，列表对应有详情，详情的展示可以有很多种形式。“向下展开”也可以看作是展示详情的一种形式。
 

模型

一个产品中，有很多内容，用户的视野是有限大小的屏幕框框。有些内容比较长，就这样折叠起来了。
这样的折叠，这样有限尺寸的屏幕框框，所以，设计时需要注意以下几个要求。
 

要求1：按钮左右位置固定

这里的“阅读全文”就是“展开”按钮。这里的规则是，显示正文的前若干个字，“阅读全文”按钮紧跟其后。按钮不单独占用下一行，节省了空间，但位置就不固定了，时左，时右。
左右位置固定更好，用户更容易找到。
展开后的样子：
展开后，全文内容很长，超出一屏，窗口底部悬浮一行，最右侧是“收起”，总是在右下角，位置固定。

知乎是做到了“收起”位置固定，但“展开”位置没固定。
 

要求2：展开与收起位置一致

“展开”按钮位置固定了，“收起”按钮位置也固定了，那，再进一小步要求：这两个按钮站在同一个位置上。
也就是说：点“展开”，内容展开，“展开”按钮变成“收起”按钮。
这样来回变换的按钮，也被称为：A/B按钮。
这样的要求源于人们的现实生活经验：电灯的开关。开和关是在一起的，按这里打开了灯，怎么关？最好还是按这里，如果要去另外一个地方才能关，既不容易想到，又不方便操作。

上面两个要求都做到了，实际效果就是：
“展开/收起”是一组互相切换的按钮，出现在每篇文章固定的位置上。
就是最前面看到的微信朋友圈的样子。