相关疑难解决方法(0)

有些日子我发誓我会发疯.这是其中一天.我认为我的CSS在这里相当简单,但它似乎并没有起作用.我错过了什么？

我的CSS看起来像这样:

ul > li {
    text-decoration: none;
}
ul > li.u {
    text-decoration: underline;
}
ul > li > ul > li {
    text-decoration: none;
}
ul > li > ul > li.u {
    text-decoration: underline;
}

我的HTML看起来像这样:

<ul>
  <li>Should not be underlined</li>
  <li class="u">Should be underlined
    <ul>
      <li>Should not be underlined</li>
      <li class="u">Should be underlined</li>
    </ul>
  </li>
</ul>

然而它出现了这样的:

当a标记包含子元素(如i标记)时,它仍然在悬停时应用下划线,我想知道i当有人将鼠标悬停在标记上时如何从标记中删除下划线a.

我正在使用的CSS:

a{
    display:block;
    text-decoration:none;
}
a i{
  color:#888;
  margin-left:5px;
}
a:hover{
    text-decoration:underline;
}
a:hover i{
    text-decoration:none !important;
}

这是一个解释的小提琴:http: //jsfiddle.net/kkz66x2q/

i当您将鼠标悬停在链接上时,我只希望下划线仅在元素上为GONE .