css中关于超链接的四个属性一般正常顺序为:link,visited,hover,active,即
a:link 链接平常的状态
a:visited 链接被访问过之后
a:hover 鼠标放到链接上的时候
a:active 链接被按下的时候
以下为点过链接后,链接字体变为红色:
a:link { color:#dd3409text-decoration:nonefont-size:13px}/* 超链接的样式 */
a:visited { color:#9f301dtext-decoration:none}
a:visited:hover { color:#9f301dtext-decoration:underline}
a:hover { color:#dd3409text-decoration:underline}
a:active { color:#ff3300text-decoration:underline}
百度那些是不同页面,只要分别改动每个导航栏即可,------------------------------------
同一页面:
<style type="text/css">
a:link,a:visited{ color:#000}
a.current:link{ color: #F00}
a.current:visited{ color: #c00}
</style>
<script>var oldid = '1'
function change(id)
{
eval("document.getElementById('menu"+oldid+"').className=''")
eval("document.getElementById('menu"+id+"').className='current'")
oldid = id
}
</script>
<a href="#" id="menu1" onclick="change(1)">Ŀ1</a>
<a href="#" id="menu2" onclick="change(2)">Ŀ2</a>
<a href="#" id="menu3" onclick="change(3)">Ŀ3</a>
---------------------------------------------------------
不同页面,共用一个头部,可以通过页面路径来判断栏目。
<style type="text/css">
a:link,a:visited{ color:#000}
a.current:link{ color: #F00}
a.current:visited{ color: #c00}
</style>
<script language="javascript" type="text/javascript">
var str=location.href
var oldid=1
if(str.indexOf("index.html")>=0) //当路径中含有index.html,设oldid=2
oldid=2
if(str.indexOf("/news/")>=0)
oldid=3
if(str.indexOf("/projects.asp")>=0)
oldid=3
eval("document.getElementById('menu"+oldid+"').className='current'")
</script>
<a href="#" id="menu1">1111</a>
<a href="#" id="menu2">2222</a>
<a href="#" id="menu3">3333</a>