Question

我确信这是一个相当简单的修复，但我无法弄明白。

我使用Dreamweaver中的页面属性来为页面上的链接提供CSS，一切正常。我现在有一行我需要更改几个链接的链接和悬停颜色。

<head>
<style type="text/css">
<!--
body {
background-color: #666666;
}

a:link {
color: #000000;
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #000000;
}
a:hover {
text-decoration: none;
color: #666666;
}
a:active {
text-decoration: none;
color: #000000;
-->
</style>
</head>

我可以通过使用正文中的以下代码成功更改链接颜色。

<a href="url" target="_blank" style="color: rgb(20,80,153)">Website</a>

我无法成功完成的是更改翻转。我搜索并尝试了几种不同的方法来解决问题，但没有取得任何成功。有人可以指出我做错了什么，或者给我一个CSS应该如何看的例子？

Answer 1

所以要为你需要的链接着色：

a{
    color: rgb(20,80,153);
    text-decoration: none;
}

然后如果你想要悬停：

a:hover {
    color: red;
}

HTML：

<a href="url" target="_blank">Website</a>

CSS：

a{
    color: rgb(20,80,153);
    text-decoration: none;
}
a:visited {
    text-decoration: none;
    color: #000000;
}
a:hover {
    color: red;
}

DEMO HERE

最重要的是，如果你不想要所有链接，你可以给他们一个类：

HTML：

<a href="url" class="test" target="_blank">Website</a>

CSS：

.test {
  color: rgb(20,80,153);
}

.test:hover {
  color: red;
}

DEMO HERE

Answer 2

为您的特殊链接special class：

<强> CSS

.link
{
    color: rgb(20, 80, 153);
}

.link:hover{..}
.link:active{..}
.link:visited{..}

<强> HTML

<a href="#" class="link">Website</a>

Answer 3

使用类名而不是仅定位a

CSS

a.someName1:link {
    color: #000000;
    text-decoration: none;
}

a.someName1:visited {
    text-decoration: none;
    color: #000000;
}

a.someName1:hover {
   text-decoration: none;
   color: #666666;
}

a.someName1:active {
   text-decoration: none;
   color: #000000;
 }

HTML

<a href="url" target="_blank" class="someName1">Website</a>

Answer 4

更改整行颜色的最简单方法是将一个类添加到所述行（或<tr>，我假设），然后为所有作为元素后代的链接添加CSS那个班。

我对你的HTML做了一些假设，但它可能会像这样......

<强> HTML：

<tr class="atl-color">
<td><a href="#">Link #1</a></td>
<td><a href="#">Link #2</a></td>
</tr>

<强> CSS：

.alt-color a:link { color: blue; }
.alt-color a:hover { color: red; }

多种样式的翻转链接

4 个答案:

HTML：

CSS：

HTML：

CSS：