Question

这就是我所拥有的

<a data-toggle="collapse" href="#collapsible-1">Digital</a>

  <div id="collapsible-1">
        HTML stands for HyperText Markup Language. HTML is the main markup language for describing the structure of Web pages.</a>
  </div>

<a data-toggle="collapse" href="#collapsible-2">Radio</a>

  <div id="collapsible-2">
        HTML stands for HyperText Markup Language. HTML is the main markup language for describing the structure of Web pages.</a>
  </div>

我使用data-toggle boostrap来显示和隐藏元素，但是我有一些小问题，这样，当页面加载可折叠的内容时总是可见的，即使我必须双击关闭元素，之后工作正常。您认为我必须做什么，将元素内容整合到页面加载时始终隐藏？

Answer 1

取自Bootstrap's documentation：

用法
  崩溃插件使用几个类来处理繁重的工作：

.collapse 隐藏内容
  .collapse.in显示内容
  。转换开始时添加.collapsing，完成时删除。

简而言之：<div id="collapsible-1" class='collapse'>

Answer 2

您需要将collapse类添加到div以默认隐藏内容，如此

<a data-toggle="collapse" href="#collapsible-1">Digital</a>

  <div id="collapsible-1" class="collapse">
        HTML stands for HyperText Markup Language. HTML is the main markup language for describing the structure of Web pages.
  </div>

<a data-toggle="collapse" href="#collapsible-2">Radio</a>

  <div id="collapsible-2" class="collapse">
        HTML stands for HyperText Markup Language. HTML is the main markup language for describing the structure of Web pages.
  </div>

Js Fiddle Demo

Bootstrap 3数据切换手风琴

2 个答案: