Bootstrap - 设置div的最小和最大宽度 - 不是列数

Question

我需要根据屏幕宽度设置列数，如果有3,4,5或6则不要选择

Answer 1

这是您的解决方案，您需要CSS的媒体查询

https://jsfiddle.net/Alan_van_Buuren/4w9wy73y/

＆＃13;

＆＃13;

.column {
  width: 50px;
  font-size: 20px;
  float: left;
}

@media screen and (min-width: 480px) {
  .column {
    width: 100px;
  }
}

@media screen and (max-width: 800px) and (min-width: 520px) {
  .column {
    width: 100px;
    background-color: yellow;
  }
}

@media screen and (max-width: 519px) and (min-width: 100px) {
  .column {
    width: 150px;
    background-color: red;
  }
}

＆＃13;

<div class="column">One</div>
<div class="column">Two</div>
<div class="column">Three</div>
<div class="column">Four</div>
<div class="column">Five</div>
<div class="column">Six</div>
<div class="column">Seven</div>
<div class="column">Eight</div>
<div class="column">Nine</div>
<div class="column">Ten</div>
<div class="column">Eleven</div>
<div class="column">Tweelve</div>

＆＃13;

＆＃13;

＆＃13;