之前有次花过两三天，考虑和寻求，响应式表格的比较好的实现方案，未果。直至今日遇到了materializecss中的做法。
表格在小屏幕上有什么问题？
表格的表头往往会比较宽，又有很多行。在屏幕宽度缩小时，如果整体全部缩小，字就用拥挤在一起，不好看。但是如果往下流呢？怎么流呢？不好流。这里存在两个主要问题：一、表头宽，二、表格行数多。
Bootstrap的做法（简单直接）
Bootstrap的方案也只是在水平方向上显示一个滚动条。这样的效果并不好。因为数据是以一行为一条记录，一行为一个对象，可如今一行被割裂了，需要滚动条来显示。失去了完整感。
Bootstrap这个响应式表格的效果。
materializecss的新方案
今天发现materializecss里面关于table的部分。这个效果还是不错的，在屏幕缩小的时候，它会自动将上面的表头移动到左侧，然后将原来的数据行变为列。相当于把表格横过来了。
PC屏幕效果
手机屏幕效果
Responsive Design的顿悟
它这么做的原因也很简单，想一想，电脑屏幕和手机屏幕的有什么区别，或者说最重要的区别，我认为是显而易见的两点，一是电脑屏幕更大，二是电脑屏幕是横这放的，手机是竖着看的。
屏幕的大小可以通过缩放来解决，但是由横着看到竖着看，怎么解决呢？横竖颠倒！Very Clear!😊
其实这也就是Responsive Design要解决的关键问题，突然顿悟。