Broadly, you can take two approaches to a responsive design. You can start with your desktop or widest view and then add breakpoints to move things around as the viewport becomes smaller, or you can start with the smallest view and add layout as the viewport becomes larger. This second approach is described as mobile first responsive design and is quite often the best approach to follow.
2种方式设计，一种是先从大的开始，往小的设计，一种是从小的开始，再增加布局适应大的viewport.

小的设备往往设计成单列，通常都是normal flow, 那意味着你设计小的屏幕的时候，不需要做很多布局的工作。把内容顺序排好，你就有一个可以读的layout了。

    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));