html - 使用 Bootstrap 根据设备显示格式

Question

我正在使用 bootstreap3 我想根据 deviec 显示一些不同的格式
如果大型和中型设备我想将左中和右用作 2、8、2 列，而对于移动和小型设备，我想显示中间的内容将全部 12 列。

我为此使用以下代码，但这对我来说并不完美。

<div> 
    <div class="col-lg-2 col-md-2" ></div>
    <div class="col-lg-8 col-md-8"></div>
    <div class="col-lg-2 col-md-2" ></div>
  </div>

这适用于 sm 和 xs 的大型和中型设备，它不是全宽的。
如何做到这一点？

Answer 1

值得引用bootstrap grid documentation .

您不需要'col-lg-2'类，因为 Bootstrap 首先是移动的(使用最小宽度媒体查询) - 样式将应用于'col-md-2'。

此外，最好将最小的网格类放在首位，例如:

<div class="col-xs-12 col-md-8"></div>

希望这可以帮助