如何让Bootstrap响应基于屏幕比例而不是像素的屏幕分辨率？

Question

当视口的高度大于视口的宽度时，我希望将两列堆叠成一列。据我所知，col-xx-xx是以像素为单位的屏幕分辨率。我已经为这两个单元尝试了col-sm-6 col-xs-12，但这不是解决方案。

解决方案是什么？

​

​

Answer 1

我在Reddit上也问了同样的问题，https://www.reddit.com/r/webdev/comments/6799m7/how_can_you_have_bootstrap_responsiveness_based/。

基本上，解决方案是基于landscape或portrait合并视图。

@media screen and (orientation: portrait){
    //css
}
@media screen and (orientation: landscape){
    //css    
}