Bootstrap 6 - 4 - 2 - 1列

Question

我用引导程序在一个非常简单的网站上做出响应式设计http://www.auto-moto-klub.cz/我花了几个小时尝试基于屏幕尺寸粗暴地实现此类行为（像素范围仅仅是示例，并非必要要准确这些）：

<= 300px .. 1 column 
>= 301px & <= 600px .. 2 columns 
>= 601px & <= 1024 .. 4 columns 
>= 1024px .. 6 columns 

目前，它的工作原理与类= “COL-SM-2” 是这样的：

<= 767px .. 1 column .. TOO BIG around 300-767px, LOOKS CRAZY 
>= 768px .. 6 colums .. TOO SMALL around 768-1024px 

我试过类=“COL-XS-1 COL-SM- 2 col-md-4 col-lg-6“..我认为这意味着在额外的小屏幕上它将有1列，在小2，在中等4和大6.但我可能根本不理解它，因为它使得奇怪的事情：

>= 1200px .. 2 columns 
<= 1199px & >= 992px .. 3 columns 
<= 991px & >= 768px .. 6 columns 
<= 767px .. 6 columns somehow broken placed on the left 

请帮助。提前感谢您的任何建议。

Answer 1

请尝试以下操作：class =“col-lg-2 col-md-3 col-sm-6 col-xs-12”。它应该解决这个问题。