隐藏在李的能见度

Question

我有这段HT​​ML代码：

<ul class="tabs">
  <li class="tab"> <a href="#" @click="show('infos')"> Infos </a> </li>
  <li class="tab"> <a href="#" @click="show('modules')"> Modules </a>
</li>

<ul class="content-tabs">
  <li class="tab infos">
    @include('layouts.forms.trainingsForm')
  </li>
  <li class="tab modules">
    modules
  </li>
</ul>

当我点击其中一个链接时，它应该通过分配类＆＃34;活动＆＃34;来显示最后一个

的内容。适当的

。这是li的css部分：

ul.content-tabs {
 border: solid 1px #ececec;
 margin: 7px 0px; 
}

ul.content-tabs li.tab {
  list-style: none;
  padding: 10px 15px;
  visibility: hidden;
}

ul.content-tabs li.active {
  visibility: visibile !important;
}

现在的问题是，即使李有班级＆＃34;活跃＆＃34;它不会出现，因为＆＃34;可见性：隐藏;＆＃34;应用于ul.content-tabs li.tab（在开发人员工具中进行一些调试之后）。

Answer 1

似乎ul.content-tabs li.tab比ul.content-tabs li更详细，所以请尝试设置：

ul.content-tabs li.tab.active { visibility: visibile !important; }