Flexbox布局，桌面上具有列，移动设备上具有行

Question

我最近开始使用flexbox。我不知道如何在网站https://krsiak.cz/上创建一个布局，该布局的标题始终始终排在第一行，而桌面上的标题始终排在下面3个部分，框（列？）彼此相邻，而在移动设备上，则都在下面彼此作为行。

我读到这里：https://css-tricks.com/snippets/css/a-guide-to-flexbox/尝试了一些方法，但不确定是否正确使用它。所有行都很容易，但是一旦尝试了列，就很好了，我使用flex: 1来填充屏幕的宽度，但是在填充显示高度时遇到了问题，容器总是太小并且在框的下方，我会有空的空间。

我能找到的最好的方法是：https://prnt.sc/q6mfvj

任何建议将不胜感激。

Answer 1

我认为这是学习flexbox的一个很好的起点：W3schools 您应该能够在其中找到示例以执行所需的操作。基本上，如果要在台式机中以行形式显示部分，在移动设备中以栏目形式显示部分，则需要使用媒体查询。 另外，我建议您至少在网格模块上使用引导程序。