css - 几个类的 CSS Hover 相同

Question

以下类应用了完全相同的 css 规则我想知道这是否是一种将这些 3 合二为一的方法。

#menuHolder .l1 a:hover
#menuHolder .l2 a:hover
#menuHolder .l3 a:hover

到目前为止，我尝试过没有运气：

#menuHolder .l1, l2, l3 a:hover
#menuHolder .l1 l2 l3 a:hover
#menuHolder .l1 a:hover, .l2 a:hover, .l3 a:hover

谢谢！

score 1 · Accepted Answer

1

你需要指定类吗？

怎么样：

#menuHolder a:hover{}

于 2011-08-17T15:19:38.697 回答

score 1 · Accepted Answer

1

#menuHolder .l1 a:hover,
#menuHolder .l2 a:hover,
#menuHolder .l3 a:hover {
    ...
}

于 2011-08-17T15:19:47.090 回答

score 0 · Accepted Answer

不，唯一的方法是：

#menuHolder .l1 a:hover, #menuHolder .l2 a:hover, #menuHolder .l3 a:hover {
    ...
}

但是，您应该做的是为所有 3 个提供一个通用类，然后是这样的：

#menuHolder .hoverable a:hover {
    ...
}

score 0 · Accepted Answer

#menuHolder .l1 a:hover, #menuHolder .l2 a:hover, #menuHolder .l3 a:hover
{

}

如果您的类始终具有相同的样式，则可以用逗号将它们分隔为相同的样式集。

但是，如果这种情况经常发生，则可能值得研究一下您的 HTML 设计，看看是否可以整理它以每次调用相同的类。

例如，如果.l1, .l2,.l3是相同的，也许将类替换为.l这样 CSS 就可以是：

#menuHolder .l a:hover
{

}

score 0 · Accepted Answer

0

 #menuHolder .l1 a:hover, #menuHolder .l2 a:hover, #menuHolder .l3 a:hover
 {

 }

于 2011-08-17T15:19:47.790 回答

5 回答 5