Bootstrap data-toggle data-target

「爱情、让人受尽委屈。」 2022-01-30 12:25 126阅读 0赞

## [HTML5 新属性][HTML5] ##

![在这里插入图片描述][20190519161635133.png]

## data-toggle & data-target ##

*  `data-toggle`和`data-target`就是Bootstrap框架中自定义的HTML标签的属性。
    
     *  `data-toggle` 告诉JS需要对按钮做什么。
     *  `data-target` 指示：需要切换到哪一个元素(目标)
 *  当设置`data-toggle="link"`和`data-target="class"`之后，`bootstrap.js`会使用这些值覆盖超链接的默认属性。  
    将href设置为静态链接将会对noscript浏览器提供一些可访问的内容。  
    见：[Bootstrap data-toggle , data-target & href attributes][Bootstrap data-toggle _ data-target _ href attributes]  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3d1eXVqaW4xOTk3_size_22_color_222222_t_70]
 *  data-toggle  
    `data-toggle`指：以什么事件触发(常用的如`modal, dropdown, tooltips`等)。  
    [The data-toggle attributes in Twitter Bootstrap][]  
    ![在这里插入图片描述][20190519162423581.png]
 *  data-target  
    `data-target`指：事件的目标。

[HTML5]: http://www.w3school.com.cn/html5/html5_ref_standardattributes.asp
[20190519161635133.png]: /images/20220130/ee87572fee564b3e88c2b9c747f29db0.png
[Bootstrap data-toggle _ data-target _ href attributes]: https://stackoverflow.com/questions/25832665/bootstrap-data-toggle-data-target-href-attributes
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3d1eXVqaW4xOTk3_size_22_color_222222_t_70]: /images/20220130/313a6c4efb6b4a11acbbddaefe91f992.png
[The data-toggle attributes in Twitter Bootstrap]: https://stackoverflow.com/questions/15113537/the-data-toggle-attributes-in-twitter-bootstrap
[20190519162423581.png]: /images/20220130/79728a54b4b64dedbec9896a7c5bac67.png

发表评论取消回复

表情：

评论列表（有 0 条评论，126人围观）

还没有评论，来说两句吧...

相关阅读

相关【Bootstrap】001-Bootstrap入门

一、介绍 1、简介（百科） Bootstrap是美国Twitter公司的设计师Mark Otto和Jacob Thornton合作基于HTML、CSS、JavaSc

拼搏现实的明天。/ 2023年10月05日 10:53/ 0 赞/ 13 阅读

相关 Bootstrap

7.Bootstrap 7.1.介绍概念：一个前端开发的框架，Bootstrap，来自 Twitter，是目前很受欢迎的前端框架。Bootstrap 是基于

╰+哭是因爲堅強的太久メ/ 2023年10月04日 12:52/ 0 赞/ 29 阅读

相关 Bootstrap

官方文档：http://v3.bootcss.com/ 中文文档：http://www.runoob.com/bootstrap/bootstrap-forms.html

太过爱你忘了你带给我的痛/ 2022年08月23日 00:42/ 0 赞/ 139 阅读

相关 bootstrap

[http://bootstrap.kinghack.com/components.html][http_bootstrap.kinghack.com_components.h

待我称王封你为后i/ 2022年08月10日 00:42/ 0 赞/ 136 阅读

相关 bootstrap-datetimepicker bootstrap选择日期

引用bootstrap-datetimepicker的css和js <div id="datetimepicker2" class="input-append">

淩亂°似流年/ 2022年08月05日 00:48/ 0 赞/ 241 阅读

相关 Bootstrapping

Bootstrapping从字面意思翻译是拔靴法，从其内容翻译又叫自助法，是一种再抽样的统计方法。自助法的名称来源于英文短语“to pull oneself up by o

分手后的思念是犯贱/ 2022年07月13日 02:37/ 0 赞/ 165 阅读

相关 Bootstrap -1(认识Bootstrap)

Bootstrap -1(认识Bootstrap) -------------------- Bootstrap的由来: B

以你之姓@/ 2022年07月12日 05:02/ 0 赞/ 206 阅读

相关 BootStrap

boostrap作为一个新生代的优秀前端框架一直被受关注，所以本博客只是帮助另外一个楼主分享他的学习经验，以及教学笔记，以帮助大家日常的工作，日常的学习，希望知识可以让我们永远

素颜马尾好姑娘i/ 2022年06月05日 01:20/ 0 赞/ 169 阅读

相关 BootStrap

0.基本概念采用 Flex 布局的元素，称为 Flex 容器（flex container），简称"容器"。它的所有子元素自动成为容器成员，称为 Flex 项目（flex

超、凢脫俗/ 2021年12月03日 10:53/ 0 赞/ 274 阅读

相关 bootstrap

[2019独角兽企业重金招聘Python工程师标准>>> ][2019_Python_] ![hot3.png][] 1.data-backdrop：为true时，点击模态框

Love The Way You Lie/ 2021年09月20日 04:40/ 0 赞/ 297 阅读