Bootstrap col-sm-6 类不适用于移动设备

Question

我正在将 sql 表中的产品放入<div class="col-sm-6 col-md-6 col-lg-3 col-xl-3 main_item_div mt-4 mb-4">div 中。我的问题是，当我在移动设备上查看我的页面时，col-sm-6 类不起作用，产品始终位于彼此下方，而不是彼此相邻的 2 个 div。您可以通过此链接查看我的网站这些 div 位于“新产品、折扣产品”标题下。谢谢！

Answer 1

再会！

<div class="col-6 col-lg-3 main_item_div mt-4 mb-4"></div>

col-sm样式适用于视口 ≥ 576px，因此您应该col在这种情况下使用。另外，您不需要同时使用col-lg-3和col-xl-3类，因为引导媒体查询基于min-width- 因此仅保留col-lg-3用于大型显示器。