背景：在公司需要做移动端项目，其中有一个页面可分为上下两部分。其中上面一部分是固定不动的，用于展示总览的卡片。而下半部分则是一个可以滚动的列表。
一开始我用的fixed固定定位将总览卡片固定在屏幕上方，然而这样存在一个问题，那就是使用fixed定位的元素会脱离文档流，从而导致后面的元素会占据原本卡片的位置，而不是预想的在卡片后面。
为了解决这个问题，我一开始的想法是通过flex+fixed的方式解决，于是利用flex将上半部分的卡片高度设为30%，position：fixed，然而并没有作用，甚至这样设置后后半部分的盒子反而出了更大的问题。
于是我想到了利用css的粘性布局，将fixed改为sticky，这次修改后就完美解决了前面的问题！
