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

【问题标题】：mouse hover on the span doesn't work鼠标悬停在跨度上不起作用
【发布时间】：2017-07-01 07:51:19
【问题描述】：

假设有这个html：

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

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

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

但这不起作用？谁能帮帮我？

【问题讨论】：

【解决方案1】：

你需要在span的css中添加!important，因为它可能会被它的父级规则继承。

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

&lt;a href="" class="hoverelement"&gt;&lt;span&gt;DOG&lt;/span&gt;&lt;/a&gt;

【讨论】：

【解决方案2】：

尝试为 a 元素指定 hover-selector。

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

【讨论】：

【解决方案3】：

改用这个：

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

【讨论】：