Div独特的CSS样式链接 [英] Div Unique CSS Style Links

问题描述

我想为一个特定div中的链接创建独特的样式（例如我想要所有的连接在主体中是粗体和红色，但在sidebardiv中我想要它们蓝色和斜体）
如何我去了吗？

I want to create unique styles for my links in a single particular div (So for example I want all links bold and red in the main body, but in the sidebardiv I want them blue and italic) How do I go about it?

我有：

a:link{
color:#666666;
}
a:visited{
color:#003300;
}
a:hover{
color:#006600;
}
a:active{
color:#006600;
}

然而，如果我把它放在侧边栏div部分，

however if I put that in the sidebar div section it messes up my }'s

推荐答案

使用 descendant selectors ：

#sidebar a:link{ color:#134896; } 
#sidebar a:visited{ color:#330033; } 
#sidebar a:hover{ color:#942A5F; } 
#sidebar a:active{ color:#6FB25C}

选择器类型，您可以链接尽可能多的后代选择器，如：

This is a fundamental css selector type, and you can chain as many descendant selectors as you wish, i.e.:

#content .navigation .header h1.red {
  /* Properties */
}

c $ c>< h1 class =red> 是具有类 header 的元素的后代，具有 content 的元素的后代的导航元素

This would match any <h1 class="red"> that is a descendant of an element with class header, that is a descendant of an element with class navigation that is an descendant of the element with id content.

后代选择器是在浏览器中实际工作的几种选择器类型之一，因此您可以依靠它们。应该注意，你应该尽可能少的选择器来实现你的目标，因为这将是一个性能提升。此外，尽量不要指定元素类型，如果你可以避免它（这是与JavaScript选择器的建议相矛盾），因为它会绑定你的CSS现在看起来如何html。开发人员可以决定将< span class =highlight> 更改为< em class =highlight> code>稍后，将打破 span.highlight -selector，而 .highlight - 选择器将继续工作。

Descendant selectors is one of the few selector types that actually works across browsers, so you can rely on them. It should be noted that you should have as few selectors as possible to achieve your targetting, as this will be a performance boost. Also, try not to specify the element type if you can avoid it (this is contradictory to the advice for JavaScript selectors), since it will tie your css to how the html looks now. A developer can decide to change a <span class="highlight"> to an <em class="highlight"> later, which would break a span.highlight-selector, while a .highlight-selector would continue to work.

这篇关于Div独特的CSS样式链接的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！