代码之家 › 专栏 › 技术社区 › im dumb

默认情况下引导行/列不折叠?

angular-ui-bootstrap twitter-bootstrap css javascript

im dumb · 技术社区 · 8 年前

我有一个类似这样的代码:

<div id="test" class="collapse">
<div class="row" style="display: flex; overflow: hidden;">
<div class="col-md-2">
<div class="col-md-10">
     Text
</div>
</div>
</div>
</div>

使用(我认为)合适的数据属性进行折叠:

<a class="btn btn-default btn-dropdown" data-target="#test" data-toggle="collapse"><i class="fa fa-bars"></i></a>

我试着将崩溃转移到不同的元素中,但没有任何效果。我错过什么了吗?

2 回复 | 直到 7 年前

Carol Skelly 8 年前

https://www.codeply.com/go/F7glxbJxGA

<a class="btn btn-default btn-dropdown" data-target="#test" data-toggle="collapse"><i class="fa fa-bars"></i></a>
<div id="test" class="collapse">
    <div class="row" style="display: flex; overflow: hidden;">
        <div class="col-md-2">
            <div class="col-md-10">
                Text
            </div>
        </div>
    </div>
</div>

Shiladitya 8 年前

给你一个解决方案 https://jsfiddle.net/sw2bnzeq/

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<a class="btn btn-default btn-dropdown" data-target="#test" data-toggle="collapse">
  <i class="fa fa-bars"></i>
</a>
<div id="test" class="collapse">
  <div class="row" style="display: flex; overflow: hidden;">
    <div class="col-md-2">
      Text
    </div>
  </div>
</div>

或