HTML双链接

Question

我的html页面上有两组链接，一组用于页面的顶部和底部，一组用于不同的页面。但是我想更改第二个。输入这段代码后

a:link {
color: green;
background-color: transparent;
text-decoration: none;
        }
       a:visited {
color: pink;
background-color: transparent;
text-decoration: none;
       }
         a:hover {
color: red;
background-color: transparent;
text-decoration: underline;
          }
      a:active {
color: yellow;
background-color: transparent;
text-decoration: underline;
  }`

我页面上的所有内容都会变成这些颜色。我该怎么做才能改变呢？

Answer 1

使用链接容器的class属性为其中的链接定义特殊样式。例如：

/* General link style */
a {
  color: #0000FF;
}

/* Style for a link inside .special container */
.special a {
  color: #00FF00;
}

<div>
  <a href="#">Link A</a>
</div>
<div class="special">
  <a href="#">Link B</a>
</div>
<div>
  <a href="#">Link C</a>
</div>