aria-expanded ;aria-hidden;data-target;data-toggle

aria-expanded表示展开状态。默认为undefined, 表示当前展开状态未知。其它可选值:true表示元素是展开的;false表示元素不是展开的。

aria-hidden字符串。可选值为true和false,true表示元素隐藏(不可见),false表示元素可见。




Bootstrap为这些a之类元素都绑定上了事件,而终止了链接默认行为。

data-toggle指以什么事件触发,常用的如modal,popover,tooltips等,data-target指事件的目标,一起使用就是代表data-target所指的元素以data-toggle指定的形式显示


data-target 与data-toggle 还有data-spy 文档总是给人一种很突兀的方式给出来,然后又没有好好解释或者是我看的不够仔细?


HTML5允许开发者自由为其标签添加属性,这种自定义属性一般用“data-”开头。
我目前理解到在bootstrap中data-target,data-toggle等属性主要有两种作用:
【1.】在CSS中作标签选择器用。
如:

[data-toggle="buttons"] > .btn input[type="radio"],
[data-toggle="buttons"] > .btn-group > .btn input[type="radio"],
[data-toggle="buttons"] > .btn input[type="checkbox"],
[data-toggle="buttons"] > .btn-group > .btn input[type="checkbox"] {
  position: absolute;
  clip: rect(0, 0, 0, 0);
  pointer-events: none;
}

【2.】 用来传递替换文本(不知道是不是这么说),见下面的例子:

input[type=checkbox].ace.ace-switch + .lbl[data-lbl]::before {
  content: attr(data-lbl);
}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值