Css 根据屏幕大小的列数？ 请考虑页面的以下布局。容器中有三列 <div class = "container"> <div class="row"> <div class="col"> </div> <div class="col"> </div> <div class="col"> </div> </div> </div>

我想解决的问题是，对于手机屏幕尺寸，我想隐藏中间的一栏。对于大于移动设备的屏幕尺寸，如平板电脑、笔记本电脑和台式电脑，我想在中间一栏显示。我怎样才能做到这一点。所有三列的宽度应相等

---

谢谢你的帮助！谢谢

通过使用css，您可以隐藏任何内容。见下文：

    <div class = "container">
      <div class="row">
        <div class="col">
        </div>
        <div class="col column-to-hide">
        </div>
        <div class="col">
        </div>
      </div>
    </div>


 <style>
    @media screen and (max-width: 500px){ 
        .column-to-hide{
           display:none;
        }
    }
  </style>

@媒体屏幕和（最大宽度：500px）{
.要隐藏的列{
显示：无；
}
}

引导包括隐藏或显示特定断点的元素。可见类是

visible xs-*

，

visible sm-*

，

visible md-*

和

visible lg-*

。隐藏的类是

隐藏的xs

，

隐藏的sm

，

隐藏的md

和

隐藏的lg

如果要隐藏小分辨率和超小分辨率的元素，可以执行类似于

---

使用引导是什么意思？您可以将类添加到要隐藏的列中，然后将css代码添加到.css文件或具有html的同一页中。如果您的引导比此css代码更强大，请更改显示：无；显示：无！重要的；您可以随意更改此最大宽度：500px作为iphone或Ipad的屏幕大小。是否有一种方法可以实现，而不使用自定义样式，而使用纯引导类？引导将列按不同顺序放置在小屏幕上，它不会隐藏它们。