[英]Bootstrap nav pills - 'active' class doesn't work in opened modal
我对nav-pills
组件有以下代码:
<ul id="steps" class="nav nav-pills form-steps">
<li class="active"><a data-toggle="pill" href="#options"></a></li>
<li><a data-toggle="pill" href="#payments"></a></li>
</ul>
这是主动a
外观的方式(基本上只是一个充满特殊颜色的圆):
.form-steps > li.active > a {
background-color: #931f2a;
}
这是常规a
的代码:
.promoter-form-steps > li > a {
border: 2px solid #931f2at;
height: 30px;
width: 30px;
border-radius: 100%;
}
我想,通过添加.active
类对应li
元件使a
填充色元件,但是当我打开模态此组件放置拳头时间没有。 当我单击另一个链接后第二次打开模式时,我看到正确的行为,即.active
类充满了颜色。 这是一个SPA,我还有另一个带有精确标记的nav-pills
,它的工作原理还不错,而且我不太理解为什么这种行为不适用于第二个nav-pills
。 我再次检查了类名和ID是否不会重复,并且我确定没有自定义js参与其中。 您能给我一个方向去检查我做错了什么吗? 提前致谢!
这是Twitter Docs确定的推荐格式:
<ul class="nav nav-pills">
<li class="nav-item">
<a class="nav-link active" href="#">Active</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#">Disabled</a>
</li>
</ul>
您的列表标签需要具有nav-item类,而锚点则需要具有nav-link类,然后才能使用活动类
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.