javascript - Bootstrap网格系统: Auto-aligning of rows and columns when any column is made hidden

Question

我正在开发一个仪表板并使用 bootstrap 进行响应式布局设计。我在这里面临的问题是: 我们将在 div/列上有一个按钮，onclick 隐藏该特定的 div/列。 需要的是，一旦我们隐藏特定行中的列，下一行中的列应该出现在该行中。
例如:

|一个 | B |
| C | D |
这里让 A B C D 是列。 如果 B 列被隐藏，我应该得到

|一个 | C |
| d |

如果 A 列被隐藏。我应该得到

|乙| C |
| D |

提前致谢!!!

Answer 1

<div class="container">   
  <div class="row">
    <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6" id="a">A</div>
    <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6" id="b" style="display:none;">B</div>
    <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6" id="c">C</div>
    <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6" id="d">D</div>
  </div>
</div>

如果您现在隐藏一列(在我的示例中 b)，它就会向上移动。