bootstrap中data-*的一些归纳
最近发现date里面的东西跟常用,但是没有过一个系统化的归纳,今天下午正好有小会空,整合一下
如下:
1. data-toggle
data-toggle指以什么事件类型触发,常用的如下。
data-toggle="dropdown"//下拉菜单
data-toggle="model" //模态框事件
data-toggle="tooltip"//提示框事件
data-toggle="tab"//标签页
data-toggle="collapse"//折叠
data-toggle="popover"//弹出框
data-toggle="button"//按钮事件
----------
2 data-dismiss
常见的是在模态窗口中用于关闭模态窗口 data-dismiss=”modal”
----------
3 data-slide-to、data-slide、data-ride
data-slide-to、data-slide、data-ride用于轮播图carousel。
属性 data-slide接受关键字 prev 或 next,用来改变幻灯片相对于当前位置的位置。
使用 data-slide-to 来向轮播传递一个原始滑动索引,data-slide-to="2"将把滑块移动到一个特定的索
引,索引从 0开始计数。
data-ride="carousel" 属性用于标记轮播在页面加载时就开始动画播放
基本上常用的data*-都在这了,具体操作还要自己多测试。
----------完-------------毕-----------------啦--------------------哈------------哈
bootstrap中data-*的一些归纳的更多相关文章
- Bootstrap 中的 Typeahead 组件 -- AutoComplete
Bootstrap 中的 Typeahead 组件就是通常所说的自动完成 AutoComplete,功能很强大,但是,使用上并不太方便.这里我们将介绍一下这个组件的使用. 第一,简单使用 首先,最简单 ...
- BootStrap中Affix控件的使用方法及如何保持布局的美观
Affix是BootStrap中的一个很有用的控件,他能够监视浏览器的滚动条的位置并让你的导航始终都在页面的可视区域.一开始的时候,导航在页面中是普通的流式布局,占有文档中固定的位置,当页面滚动的时候 ...
- Bootstrap中的 Typeahead 组件
Bootstrap 中的 Typeahead 组件其实就是嵌入到其中的typeahead.js插件,可以完成输入框的自动匹配功能,在通过一些人工的调整基本可以胜任所有的匹配功能和场景,下面介绍下简单的 ...
- bootstrap中使用日历控件
在bootstrap中使用日历控件可以参照以下资料: http://www.bootcss.com/p/bootstrap-datetimepicker/index.htm 以下是参照此资料自己做的一 ...
- 参考bootstrap中的popover.js的css画消息弹框
前段时间小颖的大学同学给小颖发了一张截图,图片类似下面这张图: 小颖当时大概的给她说了下,其实小颖也不知道上面那个三角形怎么画嘻嘻,给她说了DOM结构,具体的css让她自己百度,今天小颖自己参考boo ...
- bootstrap中popover.js(弹出框)使用总结+案例
bootstrap中popover.js(弹出框)使用总结+案例 *转载请注明出处: 作者:willingtolove: http://www.cnblogs.com/willingtolove/p/ ...
- bootstrap中table的colspan不起作用
bootstrap中table的colspan不起作用,即在不指定宽度的条件下,各个td宽度不符合colspan指定的宽度. 添加table0layout:fixed后显示正常. table{ tab ...
- Bootstrap中glyphicons-halflings-regular.woff字体报404错notfound
今天查看网站的源代码,发现有个glyphicons-halflings-regular.woff文件没有找到,因为我的网站使用了bootstrap的Glyphicons 字体图标,因此需要加载Glyp ...
- bootstrap中table页面做省市区级联效果(级联库见前面级联编辑)(非select下拉框)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- jQuery 中 data 方法的实现原理
前言:jQuery 作为前端使用最多最广泛的 JS 库,其源码每个 JSer 都应该研究一下.早就打算看却一直被各种事拖着,上次某公司面试时被问到 jQuery 中 data 方法是如何实现的,结果答 ...
随机推荐
- 报错 xxx@1.0.0 dev D:\> webpack-dev-server --inline --progress --configbuild/webpack.dev.conf.js
是因为node_modules有意外改动,导致依赖库不完整. 解决:1.删除项目下的node_modules,在你的项目目录下 重新执行npm install,这会重新生成node_modules, ...
- HDU校赛 | 2019 Multi-University Training Contest 3
2019 Multi-University Training Contest 3 http://acm.hdu.edu.cn/contests/contest_show.php?cid=850 100 ...
- -UI调试工具 SAK 布局 MD
目录 目录 SwissArmyKnife 接入方式 自动初始化版本 支持的功能 可配置项 原理 自定义功能 Markdown版本笔记 我的GitHub首页 我的博客 我的微信 我的邮箱 MyAndro ...
- 谷歌浏览器安装Elasticsearch-head 插件
下载该插件,地址:https://github.com/liufengji/es-head/blob/master/elasticsearch-head.crx 下载后的文件名是:elasticsea ...
- 《MySQL实战45讲》学习笔记2——MySQL的日志系统
一.日志类型 逻辑日志:存储了逻辑SQL修改语句 物理日志:存储了数据被修改的值 二.binlog 1.定义 binlog 是 MySQL 的逻辑日志,也叫二进制日志.归档日志,由 MySQL Ser ...
- 示例:WPF中Slider控件封装的缓冲播放进度条控件
原文:示例:WPF中Slider控件封装的缓冲播放进度条控件 一.目的:模仿播放器播放进度条,支持缓冲任务功能 二.进度: 实现类似播放器中带缓存的播放样式(播放区域.缓冲区域.全部区域等样式) 实现 ...
- jQuery中使用Ajax获取JSON格式数据示例代码
JSON(JavaScript Object Notation)是一种轻量级的数据交换格式.JSONM文件中包含了关于“名称”和“值”的信息.有时候我们需要读取JSON格式的数据文件,在jQuery中 ...
- Grafana官方和社区提供的dashboard
详见:https://grafana.com/grafana/dashboards 可以在左侧配置筛选条件,非常强大. 当然Grafana中所有的Dashboard通过JSON进行共享,下载并且导入这 ...
- 安装和使用pyltp
什么是pyltp: pyltp 是LTP的 Python 封装,提供了分词,词性标注,命名实体识别,依存句法分析,语义角色标注的功能. 安装 pyltp 测试环境:系统win10 64位, pytho ...
- 使用Python搭建http服务器
David Wheeler有一句名言:“计算机科学中的任何问题,都可以通过加上另一层间接的中间层解决.”为了提高Python网络服务的可移植性,Python社区在PEP 333中提出了Web服务器网关 ...