-
几个属性 data-toggle="popover" data-placement="left" 控制方向 title="控制标题" data-content="弹出框内容"查看全部
-
在面板中加入fade 属性可以让其产生渐入效果。查看全部
-
1.选项卡导航链接中要设置 data-toggle="tab" 2.data-target或者href要与id相匹配 3。<div class="tab-pane" id="azqw">国外内容面板</div>查看全部
-
我也是无法隐藏查看全部
-
button 用data-target="#id"和data-toggle="modal" 弹出对话框 a 用href="#id" 弹出对话框 关闭对话框用data-dismiss="modal"查看全部
-
button 按钮中有 data-toggle="modal" data-target="#mymodal-data"两个属性 然而fade是放在div中的查看全部
-
data-toggle="modal" data-target="#mymodsl" <div class="modal fade" id="mymodal">查看全部
-
哈哈哈做粗来了查看全部
-
插件引用地址：<script src="http://cdn.bootcss.com/bootstrap/2.3.1/js/bootstrap-tab.js"></script>查看全部
-
☑ 使用 panel 的 panel-title 做为触元素，使用panel-body的父元素作为折叠区； ☑ 使用一个 panel-group 来包含多个 panel，从而实现手风琴效果； ☑ 每个 panel 里的触发元素都要指定data-parent属性； ☑ data-parent 属性的值对应 panel-group样式元素的ID或者其他样式标识符； ☑ 触发元素需要指定 data-toggle，并且值为 collapse； ☑ 触发元素都要指定 data-target属性； ☑ data-target属性的值对应 panel-body 的父元素的ID或者其他样式标识符。查看全部
-
触发手风琴可以通过自定义的 data-toggle 属性来触发。其中data-toggle值设置为 collapse，data-target="#折叠区标识符"。接下来我们来看一个简单的示例：（六步） 第一步，设计一个面板组合，里面有三个折叠区： <div class="panel-group" id="myAccordion"> <div class="panel panel-accordion panel-default"></div> <div class="panel panel-accordion panel-default"></div> <div class="panel panel-accordion panel-default"></div> </div> 你将看到这样的一个效果： 第二步：给面板添加内容，每个面板包括两个部分，第一个是面板标题 panel-heading，并且在这里面添加标题 panel-title。第二个部分是面板内容，也就是折叠区，使用 panel-collapse 样式。 <div class="panel panel-accordion panel-default"> <div class="panel-heading"> <h4 class="panel-title">标题一</h4> </div> <div class="panel-collapse"> <div class="panel-body">折叠区内容...</div> </div> </div> …查看全部
-
插件源文件：collapse.js 引用地址： <script src="http://cdn.bootcss.com/bootstrap/2.3.1/js/bootstrap-collapse.min.js"></script> Bootstrap 框架中 Collapse插件(折叠)其实就是我们常见的手风琴效果。点击标题，可以让其对应的内容显示或隐藏。如下图所示： 任务 观察右侧代码，这里引用插件没有使用单独引入的方法，而是使用全部引入的方式： <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>查看全部
-
使用 data-toggle 属性还可以激活按钮的行为状态，实现在激活和未激活之间进行状态切换。例如，下面代码可以激活按钮行为特性，单击时将按钮激活，再单击可以让按钮恢复到默认状态： <button type="button" data-toggle="button" class="btn btn-primary">确认</button> 默认状态效果： 点击后的效果： 再次点击的效果： 注意，这里自定义属性是 data-toggle="button"，而不是 data-toggle="buttons"。查看全部
-
使用按钮组来模拟复选按钮和模拟单选按钮是一样的，具有同等效果，也是通过在按钮组上自定义data-toggle="buttons"来实现。唯一不同的是，将input[type="radio"]换成input[type="checkbox"]，如下所示： <div class="btn-group" data-toggle="buttons"> <label class="btn btn-primary"> <input type="checkbox" name="options" id="options1">电影 </label> <label class="btn btn-primary"> <input type="checkbox" name="options" id="options2">音乐 </label> <label class="btn btn-primary"> <input type="checkbox" name="options" id="options3">游戏 </label> <label class="btn btn-primary"> <input type="checkbox" name="options" id="options4">摄影 </label> </div> 运行效果如下：查看全部
-
模拟单选择按钮是通过一组按钮来实现单选择操作。使用按钮组来模拟单选按钮组，能够让设计更具个性化，可以定制出更美观的单选按钮组。 在Bootstrap框架中按钮插件中，可以通过给按钮组自定义属性data-toggle="buttons"，如下所示： <div class="btn-group" data-toggle="buttons"> <label class="btn btn-primary"> <input type="radio" name="options" id="options1">男 </label> <label class="btn btn-primary"> <input type="radio" name="options" id="options2">女 </label> <label class="btn btn-primary"> <input type="radio" name="options" id="options3">未知 </label> </div> 运行效果如下： 注：使用这种效果的时候，无需借助JavaScript代码来触发，因为默认Bootstrap就已经为用户初始化好了。查看全部
举报
0/150
提交
取消