Question

在我的页面正文中，我已经有a:link和a:hover。

但现在我有另一个div标签，我想要不同的a:link，a:hover和a:visited。

我该怎么做？

Answer 1

在CSS中：

div.classname a:link {
  color: #123456;
}

div.classname a:hover {
  color: #123;
}

div.classname a:visited {
  color: #654321;
}

在HTML中：

<div class="classname">
  <a href="#link">link</a>
</div>

Answer 2

为div指定一个类。

之类的东西

<div>
    <a></a> //style from a:link and a:hover
</div>
<div class="my-div">
    <a></a> //style from a:link and a:hover overridden by styles from .my-div a:link and .mydiv a:hover
</div>

风格

a:link{} //old link
a:hover{}


.my-div a:link{} //second link
.my-div a:hover{}

您可以链接css选择器以形成不同的样式组合

Answer 3

您可以使用子选择器方法：

div.one > a { color:blue; }
div.two > a { color:red; }

适用于

<div class=''><a>link</a></div>

但不是

<div class=''><p><a>link</a></p></div>

Answer 4

如果以上代码无效，您可以使用！important这样重要

.classname > a:hover{color:red !important;}
.classname > a:link{color:red !important;}
.classname > a:visited{color:red !important;}

如何更改：链接和a：单独悬停为div？

4 个答案: