鼠标悬停在跨度上不起作用

Question

假设有这个html：

<a href="" class="hoverelement"><span>DOG</span></a>

我需要增加字符串“ DOG”的大小，所以我使用以下css：

.hoverelement span:hover {
  font-size:20px;
}

但这行不通吗？ 谁能帮我？

Answer 1

尝试为a元素提供hover选择器。

a.hoverelement:hover span {
   font-size: 20px;
}

Answer 2

使用此代替：

.hoverelement:hover span {
    font-size: 20px;
}

Answer 3

您需要在span的css添加!important ，因为它可能是其父级规则所继承的。

 .hoverelement span:hover { font-size:20px !important; } 

 <a href="" class="hoverelement"><span>DOG</span></a>