默認情況下，引導行/列未摺疊？

Question

我是網絡開發新手，如果這個問題是非常愚蠢的/極其明顯的缺失，那麼我就不能這麼做了。我已經搜索了一些東西，並嘗試了幾個不同的東西，在我的各個div中添加「collapse」類的位置，但是我沒有找到任何特定於摺疊行的東西。

我有一些代碼，看起來像這樣：

<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次嘗試（這意味着我可以摺疊進/出），更重要的是，默認情況下摺疊不會顯示爲摺疊。有沒有什麼我失蹤使用flex容器，或者我如何使用從引導崩潰的東西？

我曾試着將崩潰轉移到不同的元素無濟於事。我錯過了什麼？

如果需要，我可以發佈更完整的代碼，爲了簡單起見，我只是有骨架。

Answer 1

的代碼工作正常，所以你的代碼中有其他的東西會導致它在默認情況下不會被摺疊。

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> 

Answer 2

在這裏，你去了一個解決方案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>

我猜你可能已經錯過了jQuery的或bootstrap.min.js