代码之家 › 专栏 › 技术社区 › tpow

覆盖A:链接

css

tpow · 技术社区 · 15 年前

在我的主CSS文件中,我的a:link选择器设置为以白色显示链接。

a:link{
color: white;
}

但是,我希望另一个DIV(.menuitem)中的链接为黑色。

我正在努力

.menuItem a:link{
color: black;
}

似乎不能让它工作,所以可能是错的。

有人能帮这个忙吗?

3 回复 | 直到 15 年前

Tyler Carter 15 年前

.menuItem a:link{
color: black !important;
}

Community CDub 8 年前

关于 Chacha102 我认为解决方案不理想。 !important 是一种拼凑,处理这种情况的更好方法是利用文档结构添加一些特定性。假设你 .menuItem 元素有一个共同的父元素,可能是 div 用身份证 menu ,您可以修改菜单特定的链接样式,如下所示:

#menu a:link {
    color: black;
}

额外的特殊性应该使更具体的规则对这些菜单项生效。

Michael Mao 15 年前

正在处理示例代码。但是,您的DIV标记的ID是menuitem还是menuitem类?这是我的猜测。

编辑:好的,现在我明白了。如果将CSS分离到另一个文件,并使用链接标记将其导入,那么在不使用的情况下就可以了!重要命令,请参见:

body {background-color : green;}

a:link{ color : white;}

.menuItem a:link
{
color : black;
}

而这:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US">
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>Test page</title>
<link rel="stylesheet" href="master.css" type="text/css" media="screen" title="no title" charset="utf-8">
</head>
<body>
<div>
    <a href="#">This is a link</a>
</div>
<div class="menuItem">
    <a href="#">This is a link in div menuItem</a>
</div>
</body>
</html>

希望这有帮助:)

不过,如果我将CSS代码段嵌入到HTML中,那么它就不起作用了…想知道为什么?

推荐文章