Question

我正在使用bootstrap

我知道xs col是引导程序中最小的大小但是如果我需要一个前400px的断点，我想要那个其他东西！我是怎么做到的？

Answer 1

总结回答：

您可以像

一样编写媒体查询

#bg-white .nav > li.active > a.btn-primary-li-left,
.bg-white .nav > li.active > a.btn-primary-li-left {
    background-color: #05f900 !important;
}

只有当您的像素小于400像素时才会覆盖，这是您需要的，当尺寸小于400像素时编写自定义代码

Answer 2

在使用bootstrap时编写正常的html和css。并添加额外的媒体查询一些自定义列。

＆＃13;

@media (min-width: 400px) and (max-width: 768px) {
  .row .col-xss-6 {
    width: 50%;
  }
}
/*for demo  */

[class*="col-"] {
  border: 1px solid #f00;
}

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
<div class="container-fluid">
  <div class="row">
    <div class="col-xs-12 col-xss-6">
      on lowest width, it would be 100% while on other it would be 50% upto 768px .col-xss-6 will overwrite the default width property, but will take float:left, padding-left:15px;padding-right:15px and other imp. properties from col-xs-12 itself. */

    </div>
  </div>
  <div class="row">
    <div class="col-xs-12">
      this is without col-xss-6, so it will have default bootstrap properties.
    </div>
  </div>
</div>

＆＃13;

Bootstrap（一半）xs col？s？

2 个答案: