超链接格式/颜色问题

时间:2015-08-19 21:17:15

标签: html css

我正在尝试更改特定网页http://www.e-rotaryofwalesandwest.org/about/how-to-join上超链接的颜色。由于背景是不同的颜色,我需要更改超链接颜色。否则,它将不可见。

我已经设置了一个名为.howtojoin

的css类

我已添加到子主题css样式表中,但它无效。我做错了什么?

CSS

a.howtojoin:link {color:#ffffff;}
a.howtojoin:visited {color:#cccccc;}
a.howtojoin:hover {color:#ffcc00;}

HTML

<div class="et_pb_text et_pb_module et_pb_bg_layout_light et_pb_text_align_left howtojoin et_pb_text_1">

<p>An Exisiting Rotarian? Thinking of Transferring? Too Busy to attend a more traditional club? Work getting in the way? Attend the weekly online meetings from the comfort of your home or wherever suits. Discuss and exchange ideas with others on our forums. If time is limited but you still want to serve our e-Club is for you.</p>
<p>If you are an existing Rotarian and want makeup your hours by attending our online meetings. Contact us (below) and for no charge* you can join one of our online meetings for your <a href="http://www.e-rotaryofwalesandwest.org/about/e-makeup/">Rotary e-Makeup</a>. That's the beauty of an online Rotary e-Club!</p>
<p>*Subject to change.</p>

</div>

在我的辩护中,我一直在研究和查看youtube等,但仍然没有更聪明。所以作为最后的手段,我在这里问你的专家。我不是一个人,只是先问自己,而不是先自己解决。

干杯,

克里斯托夫

2 个答案:

答案 0 :(得分:4)

将CSS更改为:

.howtojoin a:link {color:#ffffff;}
.howtojoin a:visited {color:#cccccc;}
.howtojoin a:hover {color:#ffcc00;}

遇到的第一个选择器是.howtojoin,然后链接(a)开始播放。

答案 1 :(得分:1)

您可以做的最好的事情是在您的特定页面添加一个类,如:(或者只是将此类添加到您的body标签中)

<div class="how-to-join">
    <!-- ... Rest of the code -->
</div>

然后在你的CSS中,你只能通过写:

来定位该页面
.how-to-join p a:link {text-transform:none;color:#ffffff}
.how-to-join p a:hover {text-transform:none;color:#ffcc00}
.how-to-join p a:active {text-transform:none;color:#00ff00}
.how-to-join p a:visited {text-transform:none;color:#cccccc}

您现在的目标是&#34; Page&#34;首先,然后告诉浏览器寻找每一个&#34; P&#34;标记它发现。然后针对所有&#34; a&#34;用于应用CSS规则的标签。

如果要定位&#34; a&#34;里面的标签&#34; p&#34;标签,并且您希望将规则应用于所有&#34; a&#34;页面中的标签,只需删除&#34; p&#34;从您的CSS选择器中可以像:

.how-to-join a:visited {text-transform:none;color:#cccccc}

您的代码:a.howtojoin:link {color:#ffffff;}

被解释为这个(用简单的英语):找到所有&#34; a&#34;标签有&#34; howtojoin&#34;,这可能不是你想要的。