twitter-bootstrap网格系统列小于768px

Question

我在项目中使用过bootstrap网格系统。

我希望：

• 2列，小于768px且大于384px
• 1列少于384px

编辑：我怎样才能做出这样的事情？ col-xxs-12 （Django模板示例）：

<div class="row">
    {% for item in product %}
        <div class="col-md-3 col-sm-4 col-xs-6 **col-xxs-12**">
            <div class="well">
                {{item.model}}
            </div>
        </div>
    {% endfor %}
</div>

Answer 1

作为解决方案

<style>
  @media (max-width: 384px) {
    .hidden-xxs {
      display: none;
    }

    .visible-xxs {
      display: block;
    }
  }
  @media (min-width: 385px) {
    .visible-xxs {
      display: none;
    }
  }
</style>

<div class="row hidden-xxs">
  <div class="col-xs-6">
    visible on less than 768px
  </div>

  <div class="col-xs-6">
    visible on less than 768px
  </div>
</div>

<div class="visible-xxs">
  less than 384px
</div>