默认情况下 Bootstrap 未折叠面板

2024-04-23

我有一个可折叠面板,但我希望它默认折叠。

<div class="panel panel-default">
    <div class="panel-heading">
        <h4 class="panel-title">
            <a data-toggle="collapse" href="#collapse1">
                <span class="glyphicon glyphicon-collapse-down"> </span>1st Round</a>
        </h4>
    </div>
    <div id="collapse1" class="panel-collapse collapse">
        <div class="panel-body">First round details</div>

    </div>
</div>

如果我删除collapse from

<div id="collapse1" class="panel-collapse collapse">

它可以工作,但第一次单击展开时不起作用。


在 Bootstrap 3.x 中,将一个类“in”添加到您的可折叠 div 中

<div id="collapse1" class="panel-collapse collapse in">

默认情况下它会让你的 div 保持打开状态。

Update:

使用 Bootstrap 4.0,您需要添加show类代替in.

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

默认情况下 Bootstrap 未折叠面板 的相关文章

  • Angular 2 Bootstrap 模态

    我正在尝试将 Bootstrap Modal 对话框包装在 Angular 2 组件 指令 虽然运气不太好 我看过https github com shlomiassaf angular2 modal https github com sh
  • Bootstrap 4:卡片作为具有相同高度和宽度的网格

    我正在尝试在具有相同高度和宽度的网格中订购卡片 这些卡片将有不同的内容和不同的尺寸 每行也应该有 3 个 每行的高度可以不同 但 行内的高度应该相同 整个网格中每张卡片的宽度应该相同 div class container div clas
  • 在模态上自动滚动引导模态('show')

    我有一个用于评论的引导模式 评论表格附加在评论列表的底部 我希望此模式在打开时滚动到列表底部 如果有超过 2 或 3 条评论 我已经安装了这个幻灯片插件 http jesseprice com jquery slide to plugin
  • 根据屏幕尺寸更改图像 src

    我正在尝试使用媒体查询根据屏幕尺寸更改图像 src 我尝试过背景 url x 但它不起作用 我在某处读到我应该使用 content url x 代替 但是当我这样做时 我得到一个空白页面 谁能告诉我我的代码有什么问题吗 HTML div c
  • Bootstrap Glyphicons 在 IE10 或 FF 中不显示

    我无法在 IE10 或 FF 中显示引导字形图标 我正在使用最新的 bootstrap 3 代码 并以标准方式包含字形 span class glyphicon glyphicon edit span 它们在 Chrome 中工作正常 但在
  • 配置 KnpPaginator 以与 Twitter Bootstrap 配合使用

    i m trying to apply twitter bootstrap css style to my knp pagination without modifying the vendor Is there a way to conf
  • 带圆角边框的 Div

    我不明白获得 div 的更大圆角底部边框的公式 以及是否有更简单的方法在 Bootstrap 中实现它 现在是这样的 以及我想如何开发它 header background color blue height 40px width 90px
  • 允许点击 twitter bootstrap 下拉切换链接吗?

    我们已经设置了 Twitter 引导下拉菜单以在悬停时工作 而不是单击 是的 我们知道触摸设备上没有悬停 但我们希望当我们单击主链接时能够使其正常工作 默认情况下 twitter bootstrap 会阻止它 那么我们如何重新启用它呢 只需
  • 将下拉按钮和下拉菜单放在中心?

    div class dropup center block div
  • 属性中的角度表达式

    我有一个使用 Angular 的页面 其中我从引导程序实现了弹出窗口 img class state msg 数据内容无法正确呈现 它按字面意思返回 item status message 而不是 message 的值 角度在 数据 属性中
  • 更改 Bootstrap 工具提示显示/淡入和淡出的时间量

    我正在使用 Twitter Bootstrap 添加工具提示 是否可以添加一个属性来确定工具提示显示的时间 淡入和淡出所需的时间 span class myClass span Cheers Bootstrap 使用该类 fade用于工具提
  • Twitter bootstrap:居中缩略图

    我有一个缩略图列表 它们有固定的尺寸 我希望连续缩略图的数量随着窗口的宽度而变化 使用 Twitter Bootstrap 这很容易 http jsfiddle net charlesbourasseau 5WvAL http jsfidd
  • 如何更改 Angular ui Bootstrap 日期选择器弹出窗口的大小?

    这就是我所指的 http angular ui github io bootstrap http angular ui github io bootstrap 我没有看到任何指示如何控制大小的内容 我尝试更改正文字体 但没有成功 可以通过覆
  • 当按钮处于加载状态时,如何向按钮添加微调器图标?

    Twitter 引导按钮 http getbootstrap com javascript buttons有一个很好的Loading 状态可用 问题是它只显示一条消息 例如Loading 通过了data loading text像这样的属性
  • 模态中的引导模态

    如何使用 Jquery 在另一个模态中构建引导模态 第一个模态应该在后台 当我参考引导文档时 发现一次显示多个模式需要自定义代码 任何想法 您可能想尝试 Bootstrap Modal 插件 此处演示 可堆叠 http jschr gith
  • Bootstrap 3 RC2 自定义导航栏固定顶部走两行

    我正在使用 Bootstrap 3 RC2 我试图将导航栏固定在顶部 但不是全宽 我已经复制了 CSS 中的 navbar fixed top 声明 并创建了我的 在 IE 10 上 这效果很好 但在 Chrome 28 上 该栏分为两行
  • 按百分比设置 bootstrap 模态身高

    我正在尝试制作一个带有主体的模态 当内容变得太大时 该主体会滚动 但是 我希望模式能够响应屏幕尺寸 当我将最大高度设置为 40 时 它没有任何效果 但是 如果我将最大高度设置为 400px 它会按预期工作 但不会响应 我确信我只是错过了一些
  • 单击列表时使用 bootstrap Dropdown 防止下拉菜单消失

    我正在使用使用引导下拉菜单 http twitter github com bootstrap javascript html dropdowns生成下拉菜单 我想防止点击菜单时菜单消失 我已经实现了以下代码 但它不起作用 知道如何修复它吗
  • 如何淡化循环背景图像?

    这里的菜鸟 我试图让我的静态背景变成一个轮播 我当前的html看起来像这样 div class pageContent div 和我的CSS body background url http placehold it 1600x1200 n
  • 来自 ajax 的 Bootstrap 表 json

    我有 ajax 和 bootstrap 表的问题 我有一个 ajax JSON 我用这个方法调用 document ready function ajax url php process php method fetchdata dataT

随机推荐

  • css中另一个类的悬停效果

    我有一个菜单 其中活动项目在加载时有一个活动类 这会更改其背景 其他项目的悬停会更改悬停项目的背景 ul li li li class active li li li ul 有什么方法可以删除悬停在纯 CSS 中的其他项目上的活动类背景 就
  • Backbone.js 和 JQueryUI 对话框 - 事件未绑定

    我正在尝试在 JQuery 对话框中使用 Backbone js 我已经设法让对话框呈现并打开 但它似乎没有触发我的事件 我添加了一个测试事件来检查这一点 单击它并没有得到预期的结果 我尝试按照此说明进行操作blogpost http ba
  • C 的哪些部分最可移植?

    我最近读到了 Lua 联合创始人 Luiz H de Figueredo 和 Roberto Ierusalimschy 的采访 他们讨论了 Lua 的设计和实现 至少可以说这是非常有趣的 然而 讨论的一部分让我想起了一些事情 Robert
  • 添加 Firebase 依赖项后 Gradle 同步失败:APK 打包期间出现重复文件

    添加 Firebase 依赖项似乎会破坏默认 Android Studio 项目的 Gradle 构建 这就是我所做的 我在 Android Studio 中创建了一个新的默认 Android 应用程序 它开箱即用 我将 Firebase
  • vb.net 获取目录中的文件名?

    我有以下代码 Dim text As String IO File ReadAllText C Example xtp 该代码特定于单个文件 但是我想file readalltext对于特定目录中的每个文件 我怎样才能实现这个目标 您将需要
  • PHP 将样式表添加到标头

    有没有办法在包含头文件后将样式表添加到标题中 假设我们有这样的代码 class content public stylesheets array public function addStylesheets stylesheets if e
  • php查找特定日期的周数

    我想从特定开始日期查找特定周数 例如 date 是从数据库中拖动的 即 07 08 2011 我希望这是开始日期 因此从该日期开始现在是第 3 周 这是我到目前为止的代码 但仅显示 ISO 版本 date strtotime row sta
  • 如何在 PHPUnit 中重复测试?

    我知道 repeat 选项 但我宁愿在测试中和每个测试中定义重复 在我的单元测试中 有些测试我不想重复 有些测试我比其他测试更想重复 我刚在想 protected function tearDown if test has not been
  • Jquery 选择更改未触发

    我需要捕获选择框何时发生变化 应该很简单 multiid change function alert Change Happened 但它不起作用 我怀疑问题是文档就绪时不存在选择框 只有在需要时才创建它 所以我在 HTML 中将其创建为空
  • 如何缓存WKWebView加载的资源?

    I use WKWebView显示包括图像在内的富文本 我想将这些图像缓存在磁盘上 如何获取这些 HTTP 请求并缓存响应 默认设置对 WKWebView 中加载的所有资源进行缓存 您所要做的就是在 HTTP 响应中为这些资源设置正确的标头
  • 如何从 helper/service 访问 ViewContext,通过 ViewImports @injected

    我正在编写辅助类并注入 ViewImports with inject HtmlHelperInject TestHelper TestHelper 并注册在Startup ConfigureServices with services A
  • java HTML 解析器/编辑器的推荐

    我在尝试使用第三方 HTML 编辑器执行 我希望的 简单操作时遇到了一个又一个问题 由于这些问题 我正在寻找可用于执行操作的替代 HTML 解析器的建议 这是我的情况 我的 html 中有 span 标签 带有 ID 属性来标识它们 我只想
  • 如何从 YouTube 搜索中抓取视频?

    我想搜索特定的关键字 然后抓取所有视频网址 我知道我要粘贴的代码不会这样做 但我想展示我所做的事情 chrome path r C Users Admin Documents chromedriver chromedriver exe dr
  • 覆盖单个页面的 ASP.NET 表单身份验证

    在我们的 ASP NET MVC 应用程序中 我们通过以下方式自动将用户重定向到登录页面
  • Twig 链接到当前路线但更改区域设置

    我会在现有网站中添加一些指向不同区域设置版本的链接 效果很好 但是很丑 li a href img src alt es a li li a href a li
  • 导出使用 docker-compose 创建的容器

    我创建了一系列容器docker 撰写 其中一些容器按照定义在容器中的一些规则相互通信 docker compose yml file 我需要将这些容器从serverA to serverB 相同的操作系统 但我在理解它是如何工作的方面遇到了
  • terraform 不检测 lambda 源文件的更改

    In my main tf我有以下内容 data template file lambda script temp file template file fn lambda script py data template file libr
  • 为什么我可以在 iOS 14.1 上安装我的应用程序,但不能在 14.2 上安装?

    自从安装 Xcode 12 2 以来 我无法在运行 iOS 14 2 的模拟器上安装我们的应用程序 我下载了 14 1 运行 14 1 的模拟器安装该应用程序就好了 很明显 我的同事没有这个问题 即使他运行的是相同版本的 Xcode 所以我
  • 如何使用 Psequel GUI 连接到 Mac 上的 localhost PostgreSQL?

    我跟着本教程 http www moncefbelyamani com how to install postgresql on a mac with homebrew and lunchy 在我的 Mac 上安装 PG 这是我第一次在本地
  • 默认情况下 Bootstrap 未折叠面板

    我有一个可折叠面板 但我希望它默认折叠 div class panel panel default div class panel heading h4 class panel title a href collapse1 span cla