html - 悬停效果 带有标题的列表

Question

我有一个<ul> <li>列表，其中HELP、MISC 和 POLICIES是没有<a>标签的标题。其他<li>元素的hover效果为font-size:16px（正常大小为 14px）。

我怎样才能删除hover标题？

小提琴

Answer 1

您可以使用

.footer_ul li.bold1:hover {
    font-size:14px;
    text-decoration:none;
}

删除标题的悬停

更新了 jsFiddle 文件

或替代您可以使用.footer_ul li a:hoverinstate of.footer_ul li:hover

.footer_ul li a:hover {
    text-decoration:underline;
    font-size:16px;
}

jsFiddle

Answer 2

I checked you fiddle it was good.

The only change you need to make is you have to add :hover class for a tag and not li tag

`

.footer_ul li a:hover {
    text-decoration:underline;
    font-size:16px;
}


`

Answer 3

使用:not()选择器。像这样需要进行一次更改。

.footer_ul li:hover:not(.bold1) {
    text-decoration:underline;
    font-size:16px;
}

工作演示

Answer 4

在“.footer_ul li:hover”之后添加这个 CSS

.footer_ul li:hover:first-child {
    text-decoration:none;
    font-size:14px;
}