Css 为页面的一部分而不是另一部分设置链接样式

Css 为页面的一部分而不是另一部分设置链接样式,css,Css,首先,我想说谢谢你让我受到欢迎,我在这里学到的东西比过去6个月在场外学到的要多,所以道具!我的问题困扰了我很长时间,我找不到合适的答案,也许我问错了问题。基本上,我有我的标题导航链接,我想自定义,而不影响页面上的其余链接。我想让他们改变鼠标上的颜色等使用纯css,而不改变身体中的链接。既然a:link a:visited等似乎是自己的课,我该怎么做呢?:提前谢谢 html: <a class='fancylink'>Hi</a> <a>No Fancy Lin

首先,我想说谢谢你让我受到欢迎,我在这里学到的东西比过去6个月在场外学到的要多,所以道具!我的问题困扰了我很长时间,我找不到合适的答案,也许我问错了问题。基本上,我有我的标题导航链接,我想自定义,而不影响页面上的其余链接。我想让他们改变鼠标上的颜色等使用纯css,而不改变身体中的链接。既然a:link a:visited等似乎是自己的课,我该怎么做呢?:提前谢谢

html:

<a class='fancylink'>Hi</a>
<a>No Fancy Link</a>
这不是什么设计,但它回答了您的问题。=)


然后执行相同的操作,但更改类的名称

只需使用父选择器,将要编辑的链接包装起来,而不更改包装中的任何其他链接

html


另外请注意,firefox和chrome的最新版本不支持:由于安全问题,您希望在CSS中使用特殊性。这可以通过多种方式实现

方法1:类

首先,向所有导航链接添加类似的类,例如

第二,在CSS中,添加

a.classname:link {} 
a.classname:visited {} 
/* etc */
方法2:容器

首先,将所有导航链接分组到一个称为容器的标记中,例如

<div id="idname">
<a href="#"></a>
<a href="#"></a>
</div>

CSS选择器有多个部分,由空格分隔。这些部分中的每一部分都从上一部分的子项(或子项的子项,等等)中进行选择,如果是最后一部分,则从整个页面中进行选择。(如果存在类似于
的内容,则此行为会发生变化,但这与此问题无关)

每个部分都可以有多个用于过滤的内容。例如,您提到了
a:link
。这是两个部分:
a
,将其过滤为
a
标记;以及
:link
,将其过滤为链接。如果你把这些放在一起,它会说“
a
标签是链接”


如果您将其与ID选择器(
#ID
)一起使用,您可以制作类似于
#header a:link
,它将只针对
a
标记,这些标记是元素中的链接,这些元素的
ID
header

,好的,我可以工作,但当我单击链接时,它会变成紫色,尽管我尝试过没有访问和活动设置,也尝试过将它们设置为白色,但我希望文本为白色,鼠标上方为蓝色,仅此而已:/edited以满足您的需要,请注意,您可以使用相同的方式设置其余链接的样式扫描我们使用相同的逻辑,将a标记更改为div标记,那么div标签就是链接…?@Nathan:它不会改变
div
s的行为,但是
div
s将按照您在块中定义的方式进行样式设置。答案太棒了,但我现在遇到的问题是a:visted和a:active当设置为白色时,将a:hover设置为白色,而不是蓝色。当没有的时候,他们使用浏览器标准,为什么他们要改变我的悬停?Nvm解决了这个问题,只需要重新排序css。
.firstbit a,
.firstbit a:hover
{
   Style stuff here
}
<div id="header"><a href="">styled link</a></div>
<a href="">not styled link</a>
#header a, #header a:active, #header a:link, #header a:visited { color: white }
#header a:hover { color: blue }
a.classname:link {} 
a.classname:visited {} 
/* etc */
<div id="idname">
<a href="#"></a>
<a href="#"></a>
</div>
#idname a:link {}
#idname a:visited{}
/* etc */