第一次用CSS写的Tab

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< html  xmlns ="http://www.w3.org/1999/xhtml" >
< head >
< meta  http-equiv ="Content-Type"  content ="text/html; charset=gb2312"   />
< title ></ title >
< style  type ="text/css" >
body { margin : 0px ; }
.cx {
    width :  500px ;
/*     border:solid 1px #000;   */
    font-family : Arial,sans-serif ;
    font-size : 12px ;
    border-bottom : solid 10px #C6D4E7 ;
}
.c {
    width :  500px ;
/*     border:solid 1px #000;   */
    font-family : Arial,sans-serif ;
    font-size : 12px ;
    height : 24px ;
    border-bottom : solid 10px #C6D4E7 ;
}  
.m {
    border : solid 0px #000 ;
}
.m ul {
    list-style :  none ;
}
.m li {
    float :  left ;
}
.m li a {
    display :  block ;
    width :  50px ;
    padding : 5px ;
    text-align : center ;
}
.m a:link,.m a:visited {
    color :  #000 ;
    text-decoration :  none ;
}
.m a:hover {
    text-decoration : underline ;
    color : #f00 ;
    background :  #C6D4E7 ;  
}
.current {
    background :  #C6D4E7 ;
    color : #000 ;
}

#content {
    position : absolute ;
    border : solid 1px #C6D4E7 ;
    margin-top : 0px ;
    width : 498px ;
    height : 100px ;
    color : red ;
    font-size : 12px ;
}
</ style >
< script  type ="text/javascript"  language ="JavaScript" >
if (navigator.userAgent.indexOf( " Firefox " ) > 0 )
{
     // window.alert("请不要使用FireFox这种讨人厌的浏览器了");
}
function  change(obj)
{
//     alert(obj.className);
     var  cs = obj.parentNode.childNodes;
     for (i = 0 ;i < cs.length;i ++ )cs[i].className = '';
    obj.className = 'current';
     // document.getElementById('content').innerHTML=obj.innerText;
    navigator.userAgent.indexOf( " Firefox " ) < 0 ? document.all.content.innerHTML = obj.innerText.replace(' ',''):document.getElementById('content').innerHTML = " <font>FF是个垃圾</font> " ;
}
</ script >
</ head >
< body >
< div  id ="container"  class ="c" >
< div  id ="menu"  class ="m" >
< ul >
< li  class ="current"  onclick ="change(this)" >< a  href ="javascript:void(0)" > 首  页 </ a ></ li >
< li  onclick ="change(this)" >< a  href ="javascript:void(0)" > 产  品 </ a ></ li >
< li  onclick ="change(this)" >< a  href ="javascript:void(0)" > 服  务 </ a ></ li >
< li  onclick ="change(this)" >< a  href ="javascript:void(0)" > 售  后 </ a ></ li >
< li  onclick ="change(this)" >< a  href ="javascript:void(0)" > 支  持 </ a ></ li >
</ ul >
</ div >
</ div >
< div  id ="content" ></ div >
</ body >
</ html >

转载于:https://www.cnblogs.com/Jscriptman/articles/Tab.html