当前位置：首页 → 问答吧 → 关于链接文字颜色的问题?

关于链接文字颜色的问题?

时间：2010-05-20

来源：互联网

a:link {color: #ffffff}
a:visited {color: #ffffff}
a:hover {color: #ffffff}
a:active {color: #ffffff}
a {text-transform:none;text-decoration:none;}
a:hover {text-decoration:underline}

添加如上代码,该网页所有朝链接文字均变成白色

但有几处文字需要是黑色
比如下面

<div class="menu-line"><a href="#"> ddddd </a></div>
我知道这样加可以:
<div class="menu-line"><a href="#"><font color="#000000">dddddd</font></a></div>
好象下面这样,我鼠标放上去之后他又变成白色了:
.menu-line a{
color:#000000;
}
<div class="menu-line"><a href="#">dddddd</a></div>

我该如何处理,请各位帮忙,先谢谢了

<html> <head> <style> a:link {color: #ffffff} a:visited {color: #ffffff} a:hover {color: #ffffff} a:active {color: #ffffff} a {text-transform:none;text-decoration:none;} a:hover {text-decoration:underline} .menu1{ height:30; font-size:14px; color:#ffffff; padding-left:10px; padding-top:8px; } .menu-border{ margin:5,5,5,5; border-left:1px solid #525D39; border-top:1px solid #525D39; border-right:1px solid #525D39; border-bottom:1px solid #525D39; } .menu-font{ margin:5,5,5,10; font-size:14px; } .menu-line{ margin:5,2,5,0; border-bottom:1px solid #A5CFEF; } .menu-line span a{ color:#000000; } .menu-line span{ margin:5,2,5,10; } body { FONT-FAMILY:"Arial, Helvetica, sans-serif"; } </style> <script language="javascript"> function qiehuan(menuid,menuimg){ var mimg=document.getElementById(menuimg); if(document.getElementById(menuid).style.display=="none") { document.getElementById(menuid).style.display="block"; } else { document.getElementById(menuid).style.display="none"; } } </script> </head> <body bgcolor="#DEE7F7" leftmargin="0" topmargin="0"> <div class="menu-border"> <div class="menu1" id="menu1" ><span><a href="#" > 网站首頁</a> <a href="#">后台首頁</a></span> </div> </div> <div class="menu-border"> <div class="menu1" id="menu2" > <a href="#" id="clickme1" onClick="javascript:qiehuan('menu-type','clickme1')"> </a><a href="#" onClick="javascript:qiehuan('menu-type','clickme1')"><span > 常用网頁操作</span></a> </div> <div class="menu-font" id="menu-type" > <div class="menu-line"><span><a href="#">類別</a></span></div> <div class="menu-line"><span><a href="#">公告</a></span></div> <div class="menu-line"><span><a href="#">新聞</a></span></div> <div class="menu-line"><span><a href="#">編輯用戶</a></span></div> </div> </div> <div class="menu-border"> <div class="menu1" id="menu3" > <div align="center"><span><a href="#" > 退出</a> </span> </div> </div> </div> </body> </html>
提示：您可以先修改部分代码再运行

[ 本帖最后由 sevenu 于 2010-5-20 08:45 编辑 ]

作者: sevenu 发布时间: 2010-05-20

你最上面写的伪类是对应页面内所以a标签元素产生效果的，你要是想单个a效果不同，则你需要再写一套a标签伪类例如:
.menu-line a:link{}
.menu-line a:visited{}
.menu-line a:hover{}
.menu-line a:active{}

作者: cwq2jxl 发布时间: 2010-05-20

OK!真是谢谢了!!!!

作者: sevenu 发布时间: 2010-05-20