素材牛VIP会员
Bootstrap中data-target 到底是什么
 ed***on  分类:Html5  人气:1075  回帖:1  发布于6年前 收藏

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

 标签:bootstrapcsshtml5

讨论这个帖子(1)垃圾回帖将一律封号处理……

Lv4 码徒
lh***81 产品经理 6年前#1

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);
}
 文明上网,理性发言!   😉 阿里云幸运券,戳我领取