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

这可能吗？我已经看遍了谷歌，无法找到我正在寻找的答案。这里的问题：是否有可能像我们说的div标题中的文本有红色悬停，并在页脚的div中的文本白色悬停？是否可以在css中使用多种链接样式？

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

我希望我解释得很好。

在此先感谢！

2011-09-27 Alexander Vaz

这是非常可能的，就像任何其他的元素，你可以通过更具体的单独样式。

如果你有这样的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; 
}

来源

2011-09-27 08:03:56 Kokos

唉唉OKE太棒了！而且，呃链接，主动，被访问的作品也是一样的权利？我只是使用这样的一条线：#top a，链接，访问，活动？每天都会更加明智：D谢谢你和其他人在这里帮助我：D –

@AlexanderVaz作品一样，是的。但是你应该注意''#top .one，.two'在'＃top'里面的'.one'和任何**'.two';你会希望'#top .one，#top .two'。 – ANeves

Yea Alexander，如果您只需输入'a'，您将同时设置'link'，'visited'，'hover'和'active'。然后，您可以将其他人单独设置为需要更改的人。 – Kokos

那么你只需选择a：链接的元素，并应用那样的样式。

即

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

来源

2011-09-27 08:03:50 MassiveAttack

是的，这是可能的。

#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类应用于任何元素以获得悬停效果。

来源

2011-09-27 08:04:40 Gazler

这不会工作，'一'元素不会从父类继承颜色，因此需要专门针对它们。 – Kokos

我提供了一个工作示例。如果你认为那么你会发现它确实有效。 – Gazler

@Gazler您的示例不使用标签。在里面放一个标签，你会看到Kokos在说什么。 –

您可以设置几乎一样多，只要你想，如果你只是把它挂右：

/* 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; }

来源

2011-09-27 08:05:20 Joonas

感谢您的帮助！ –

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

回答

相关问题