Html 以snake模式在移动视图中显示引导网格

我想在我的网页的移动视图上以蛇形模式排列引导网格。目前我的网格模式如下所示：-

1  2 
3  4 

在我的网页上

在移动视图中

1
2
3
4

我想把它当作

1
2
4
3

等等。。这样的安排应该怎么办

<div class="col-sm-8">This is Grid Cell 1

<div class="col-sm-4">This is Grid Cell 2


<div class="col-sm-4">This is Grid Cell 3

<div class="col-sm-8">This is Grid Cell 4

这是网格单元1
这是网格单元2
这是网格单元3
这是网格单元4

您可能会从这个发布了类似问题的用户那里得到一个想法：但您也可以添加bootstrap flex：这是否回答了您的问题？