Question

这可能吗？我看了遍谷歌，无法找到我正在寻找的答案。这里的问题是：是否有可能让我们说div标题中的文本有一个红色的悬停，而页脚中的div中的文本是否为白色悬停？

或者这是不可能的，你只能为整个文件设置1种风格吗？

我希望我能解释清楚。

提前致谢！

Answer 1

如果你只是勾选它，你可以设置多达你想要的数量：

/* every a:hover has color red */
    a:hover { color: red; } 
/* #footer a:hover has color green. */   
    #footer a:hover { color: green; } 
/* Every link that has class ".ThisClass" will have yellow color */
    a.ThisClass:hover { color: yellow; }

Answer 2

这是非常可能的，就像任何其他元素一样，您可以通过更具体的方式单独设置它们。

如果你有这个HTML：

<div id="top">
    <a href="#">First link</a>
</div>

<div id="bot">
    <a href="#">Second link</a>
</div>

使用此CSS，您可以设置两个链接的样式：

a:hover {
    color: #000;
}

使用此CSS，您可以单独设置它们的样式：

#top a:hover {
    color: #f00;
}

#bot a:hover {
    color: #fff;
}

Answer 3

是的，这是可能的。

#header a:hover {
    color: #f00;
}

#footer a:hover {
    color: #0f0;
}

http://jsfiddle.net/wrygB/2/

你可能想分开这个，所以你可以在其他地方使用相同的悬停。在这种情况下你会这样做：

.main:hover {
    color: #f00;
}

.sub:hover {
    color: #0f0;
}

然后你可以将一个main或sub类应用于任何元素以获得悬停效果。

Answer 4

你只需选择a：link所在的元素，然后应用这样的样式。

即

#header a:hover { color: red; }
#footer a:hover { color: white; }

是否可以在css中使用多个链接样式？

4 个答案: