如何更改引导程序中面板的折叠方向

2024-01-10

我有一个众所周知的基本可折叠面板,其代码如下所述。我通过 css 设置更改了一些属性,例如折叠和折叠高度和宽度,但无法更改折叠方向。我想将其更改为与默认位置相反的顶部。我怎样才能做到这一点?我向你保证,我尝试了多种方法,但无法解决问题。

<div class="panel-group">
    <div class="panel panel-default">
        <div class="panel-heading">
             <h4 class="panel-title">
                        <a data-toggle="collapse" href="#collapse1">Collapsible panel</a>
                    </h4>

        </div>
        <div id="collapse1" class="panel-collapse collapse">
            <div class="panel-body">Panel Body</div>
            <div class="panel-footer">Panel Footer</div>
        </div>
    </div>
</div>

只需交换位置即可.panel-heading and #collapse1.

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</head>
<body>

<div class="panel-group">
            <div class="panel panel-default">
                
                <div id="collapse1" class="panel-collapse collapse">
                    <div class="panel-body">Panel Body</div>
                    <div class="panel-footer">Panel Footer</div>
                </div>

<div class="panel-heading">
                    <h4 class="panel-title">
                        <a data-toggle="collapse" href="#collapse1">Collapsible panel</a>
                    </h4>
                </div>
            </div>
        </div>

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

如何更改引导程序中面板的折叠方向 的相关文章

  • 如果数字小于 10,则显示前导零 [重复]

    这个问题在这里已经有答案了 可能的重复 JavaScript 相当于 printf string format https stackoverflow com questions 610406 javascript equivalent t
  • 如何获取 UIWebView 中元素的位置?

    我在 iPad 程序中加载了 html 的 UIWebView 通过使用 webkit column width 我将 html 分为几列 padding 0px height 1024px webkit column gap 0px we
  • 如何在 Google 地图 V3 中创建编号地图标记?

    我正在制作一张上面有多个标记的地图 这些标记使用自定义图标 但我还想在顶部添加数字 我已经了解了如何使用旧版本的 API 来实现这一点 我怎样才能在V3中做到这一点 注意 当您将鼠标悬停在标记上时 标题 属性会创建一个工具提示 但我希望即使
  • 三级十进制有序列表 CSS

    我有一个 html 中的三级有序列表 我想为其提供如下样式 1 Item 1 1 1 Item 2 1 1 1 Item 3 下一个 plunker 中有一个 html 示例 http plnkr co edit DqhZ5pJILTUHG
  • 显示覆盖以覆盖整个页面

    我有一个正在加载的网络应用程序iframe 我需要显示一个覆盖 div 来覆盖整个页面 问题是叠加层当前仅显示在iframe区域而不覆盖整个页面 我们的应用程序 子应用程序 是加载的一组应用程序的一部分iframe 你可以做这样的事情 di
  • 使用异步调用时如何从 javascript 更新元刷新?

    我有一个系统 它使用元刷新来注销页面 该系统会在空闲用户后进行清理 不用担心 服务器也会导致会话超时 我开始通过 ajax 进行一些操作 不是真正的 xml 但这不是重点 我可以运行从异步请求返回的javascript 所以我想知道是否可以
  • 在 Javascript 中减少/分组数组

    基于this https stackoverflow com a 40774906 3254598例如 我想以稍微不同的方式按对象进行分组 结果应该如下 key audi items make audi model r8 year 2012
  • KeyboardAvoidingView - 隐藏键盘时重置高度

    我正在使用 React NativeKeyboardAvoidingView设置我的高度View当显示键盘时 但是当我关闭应用程序中的键盘时 视图的高度不会变回原来的值
  • 带显示块的SPAN

    和默认有什么区别 div 元素和默认值 span 元素与display block HTML 元素的有效性和语义存在差异 否则它们是相同的 div and span两者都被定义为通用容器 在 HTML 方面没有更深层次的含义 一个默认为块显
  • 将剪贴板图像粘贴到画布

    我有一个画布 我需要用户能够将图像粘贴到上面 我希望这是跨浏览器的 我只想使用 html javascript 我也愿意使用 Flash 对象 这在 Chrome 中工作得很好 尽管到目前为止我还没有弄清楚如何让它在 Firefox 中工作
  • 博客上的随机背景图片

    我正在尝试整理某种代码 以随机化我的博主博客上的背景图像 我的编程技能不足 但我愿意尝试建议 我记得在 WordPress 中实现了类似的功能 通过将 php 代码文件存储在图像文件夹中 然后从 CSS 中调用该 php 文件 就像它是图像
  • LinkedIn 共享网站时不获取元数据

    我在 LinkedIn 上共享正在处理的网站时遇到问题 LinkedIn 不会从该页面获取任何数据 该网站的元数据遵循以下建议他们的文档 https help linkedin com app answers detail a id 466
  • Visual Studio 2015 RTM - 更新 TypeScript 工具后失去 JavaScript 支持

    将 TypeScript 工具从版本 1 5 3 更新到 1 5 4 后 我在 Visual Studio 2015 中失去了对 JavaScript 文件的支持 我所说的对 JavaScript 的支持是指智能感知 语法着色以及选项菜单
  • Java Jackson:反序列化复杂的多态对象模型:JsonMappingException:意外的标记(START_OBJECT),预期的VALUE_STRING

    我有这棵对象树 A B延伸A C延伸B D 延伸 B E延伸C F 扩展 A 并且有一个对 A 的引用 A 有以下注释 JsonTypeInfo use JsonTypeInfo Id CLASS include JsonTypeInfo
  • dom 元素转换后 IE 显示水平滚动条

    我在网站的各个地方使用了以下 css http jsfiddle net uycq29mt 1 http jsfiddle net uycq29mt 1 a position absolute background red width 60
  • 无法在 Chrome 中设置 currentTime

    由于某些原因 在 Chrome 中我无法设置音频标签的 currentTime 属性 我可以提醒 currentTime 并且它显示正确 但是当我尝试设置 currentTime 时它会恢复为零 进度条上有一个事件侦听器 它会触发如下所示的
  • 无法更改 SVG 元素的类名

    我想通过单击按钮来更改应用于 SVG 的类 代码是here http jsfiddle net p19rnmev 我的 SVG 看起来像
  • jquery:焦点到 div 不起作用

    ajax功能结束后 在成功消息中 我关注特定的 div 但这不起作用 我的代码在这里 j ajax url type POST data action press release page 0 do task do task id id m
  • Emberjs 将多个控制器加载到一个控制器中

    SCENARIO我目前有一个IndexRoute 我想将另外 3 个控制器加载到其中 另外 3 个控制器称为Sports News Business 我阅读了 embersjs 文档 它指出您需要实现renderTemplate钩入Inde
  • 如何使用 Javascript 访问 iframe 元素?

    我有一个网页 其中 iframe 中有一个文本区域 我需要从其子页面 JavaScript 中读取此文本区域的值 目前通过使用window parent getelementbyID value在 JavaScript 中 我能够获取父页面

随机推荐

  • 我可以在内容加载之前更改或控制 IFRAME 区域的颜色吗? [复制]

    这个问题在这里已经有答案了 可能的重复 fb 之类的按钮会在所有 ie 版本中的页面加载上创建白色背景 https stackoverflow com questions 6438502 fb like button creates a w
  • 如何将输入值传递到 Angular 6 中表单提交的函数中?

    所以当我按回车键时我的代码就可以工作 它运行performSearch函数成功 但是当我尝试通过点击提交按钮运行该函数时 出现错误 无法读取未定义的属性错误 这是我的代码
  • 如何用 Any 类型来包装价值?使用@Parcelize

    我在尝试将值放入 Any 类型时遇到问题 放入包裹中 我正在使用 kotlinx android parcel 中的 Parcelize Lint 警告我并提示要添加的消息 RawValue 但这没有帮助 我有 android os Bad
  • 表单元素的 action 属性可以为空吗?

    从 HTML5 开始 广泛使用和推荐的action 是无效的 HTML 从规格来看 如果指定了 action 和 formaction 内容属性 则必须具有 一个有效 URL 的值 那么正确的方法是什么action属性指向当前页面 我目前正
  • 在R中快速读取多个文件

    我有超过 10000 个 csv 文件 我需要对每个 csv 文件的每一列进行快速傅里叶变换 我可以访问 1000 个核心 最快的方法应该是什么 目前我有一个 for 循环按顺序读取每个文件并使用apply data 2 FFT 功能 我该
  • 如何确保应用程序只有一份副本在运行? [复制]

    这个问题在这里已经有答案了 可能的重复 防止 Linux 上出现多个进程实例 https stackoverflow com questions 2964391 preventing multiple process instances o
  • 如何在 Spring 中检查 Request Scope 的可用性?

    我正在尝试设置一些代码 如果 spring 的请求范围可用 这些代码将以一种方式运行 如果所述范围不可用 则以另一种方式运行 所涉及的应用程序是一个 Web 应用程序 但有一些 JMX 触发器和计划任务 即 Quartz 也会触发调用 E
  • 如何在 TypeScript 中将项目推送到 [string]

    我想将项目添加到 string 但以下代码在 param push 语句处失败 EDIT declare var sqlitePlugin any var query string SELECT FROM items var param s
  • 请求位置更新的频率超过 5 秒(Android Fused 位置)

    我正在制作一个实时位置监听应用程序 我需要调用位置更新每 3 秒一次 I use Fused https developer android com google play services location html地点 我的间隔设置为
  • 具有多个条件主题的 Firebase API 调用

    我在调用 FCM API 时遇到一个悲惨的问题 简而言之 当我使用以下方式调用 API 时 URL https fcm googleapis com fcm send Content Type application json Author
  • 祖先查询解析错误

    我正在努力让我的祖先查询 https developers google com appengine docs python datastore structuring for strong consistency工作 但我不断收到此错误
  • 如何在 C# 中将 int[] 转换为 byte[]

    如何在 C 中将 int 转换为 byte 一些代码将不胜感激 EDIT 我需要一个函数来执行以下操作 byte FuncName int Input 由于您的问题中的细节很少 我只能猜测您要做什么 假设您想将 2D 整数数组 展平 为 1
  • 后台工作人员:在执行 RunWorkerCompleted 之前确保 ProgressChanged 方法已完成

    假设我正在使用后台工作者并且我有以下方法 private void bw DoWork object sender DoWorkEventArgs e finalData MyWork sender as BackgroundWorker
  • 当调用函数时,堆栈帧真的会被推入堆栈吗?

    我很长一段时间以来所学到的方法是 当我运行程序时 立即进入堆栈的第一件事是 main 方法的堆栈帧 如果我从 main 中调用一个名为 foo 的函数 那么一个堆栈帧 即局部变量 自动对象 的大小 和参数也会被推入堆栈 然而 我遇到了一些与
  • CefSharp获取页面截图

    是否可以使用以下方式获取网页的屏幕截图CefSharp 我找到了有关的信息GetImage 方法 但似乎不再支持 还有其他办法吗 我需要从屏幕外浏览器获取屏幕截图 因此制作显示浏览器的屏幕屏幕截图并不是解决方案 我已经在分叉分支中实现了此功
  • 如何在android中使用openstreetmap通过纬度和经度获取城市名称[关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 在我的应用程序中 我使用 osm 而不是谷歌地图 我有纬度和经度 所以从这里我将如何查询从 osm 数据库获取城市名称 请帮助我 我正在使
  • 显示一个句子,一次一个字符

    我想用 jQuery 一次一个字符地显示一个句子 有没有一个插件可以做到这一点或者我怎样才能达到这种效果 你可以写一个小插件来做到这一点 这里有一些可以帮助您入门的东西 远非完美 只是为了给您一个想法 function fn writeTe
  • 可索引类型 - TypeScript

    下面的语法 interface StringArray index number string 指出当StringArray索引为number 它将返回一个string 例如 let myArray StringArray myArray
  • 获取 JSON 格式的 JSDoc 输出

    有没有办法配置 JSDoc 使输出采用 JSON 格式而不是通常的 HMTL 格式 有一个选项 X 解释 它使用已解析的 AST 创建 JSON 文件 jsdoc X mylib gt jsdoc ast json 要理解此 JSON 您可
  • 如何更改引导程序中面板的折叠方向

    我有一个众所周知的基本可折叠面板 其代码如下所述 我通过 css 设置更改了一些属性 例如折叠和折叠高度和宽度 但无法更改折叠方向 我想将其更改为与默认位置相反的顶部 我怎样才能做到这一点 我向你保证 我尝试了多种方法 但无法解决问题 di