最近看了这里的一条标签效果，很好看，但楼主很粗心，只是放出了DIV的布局，没有样式控制，对于新手来说，不太会使用，所以花了点时间去把它弄好再放上来给大家，希望喜欢 ！！！

    演示地址：http://www.hrclass.cn

    效果图

此主题相关图片如下：11.jpg

全部的代码如下：

原版修正版

<DIV class=first_center style="WIDTH: 308px; HEIGHT: 139px">
<DIV class=first_center_1 style="WIDTH: 300px; HEIGHT: 54px">
<DIV align=center>
<U><FONT color=#800080>{LB_首页头条}</FONT></U></DIV>
<DIV align=center>
<U><FONT color=#800080>{LB_首页标题不规则}</FONT></U></DIV></DIV>
<DIV id=cntR style="WIDTH: 302px; HEIGHT: 300px">
<DIV id=NewsTop>
<DIV id=NewsTop_tit style="WIDTH: 300px; HEIGHT: 24px">
<P class=topTit style="WIDTH: 115px; HEIGHT: 21px"><FONT size=2><FONT color=#ff0033>&nbsp;<FONT color=#083aa1>今日热门排行</FONT></FONT></FONT></P>
<P class=topC1 style="WIDTH: 46px; HEIGHT: 21px" value="1"><STRONG>&nbsp;新闻</STRONG></P>
<P class=topC0 style="WIDTH: 46px; HEIGHT: 21px" value="2"><STRONG>&nbsp;生活</STRONG></P>
<P class=topC0 style="WIDTH: 46px; HEIGHT: 21px" value="3"><STRONG>&nbsp;咨讯</STRONG></P>
<P class=topC0 style="WIDTH: 46px; HEIGHT: 21px" value="4"><STRONG>&nbsp;回族 </STRONG></P></DIV>
<DIV id=NewsTop_cnt><SPAN title="Don't delete me"></SPAN><SPAN class=dis>
<DIV align=right>{LB_首页生活排行}</DIV></SPAN><SPAN class=undis>
<DIV align=right>{LB_国内新闻排行}</DIV></SPAN><SPAN class=undis>
<DIV align=right>{LB_首页咨讯排行} </DIV></SPAN><SPAN class=undis>
<DIV align=right>{LB_首页本地排行}</DIV></SPAN></DIV>
<SCRIPT>
    var Tags=document.getElementById
('NewsTop_tit').getElementsByTagName('p');
    var TagsCnt=document.getElementById
('NewsTop_cnt').getElementsByTagName('span');
    var len=Tags.length;
    var flag=1;//修改默认值
    for(i=1;i<len;i++){
     Tags[i].value = i;
     Tags[i].onmouseover=function(){changeNav
(this.value)};
     TagsCnt[i].className='undis';   
 
    }
    Tags[flag].className='topC1';
    TagsCnt[flag].className='dis';
    function changeNav(v){
     Tags[flag].className='topC0';
     TagsCnt[flag].className='undis';
     flag=v;
     Tags[v].className='topC1';
     TagsCnt[v].className='dis';
    }
   </SCRIPT>
</DIV></DIV><FONT style="BACKGROUND-COLOR: #eef7fc"></DIV>

去掉了头条的版本

<DIV id=cntR style="WIDTH: 250px; HEIGHT: 300px">
<DIV id=NewsTop>
<DIV id=NewsTop_tit style="WIDTH: 250px; HEIGHT: 24px">
<P class=topTit style="WIDTH: 100px; HEIGHT: 21px"><FONT size=2><FONT color=#ff0033>&nbsp;<FONT color=#083aa1>今日热门排行</FONT></FONT></FONT></P>
<P class=topC1 style="WIDTH: 35px; HEIGHT: 21px" value="1"><STRONG>新闻</STRONG></P>
<P class=topC0 style="WIDTH: 35px; HEIGHT: 21px" value="2"><STRONG>生活</STRONG></P>
<P class=topC0  style="WIDTH: 35px; HEIGHT: 21px" value="3"><STRONG>咨讯</STRONG></P>
<P class=topC0 style="WIDTH: 35px; HEIGHT: 21px" value="4"><STRONG>回族 </STRONG></P></DIV>
<DIV id=NewsTop_cnt><SPAN title="Don't delete me"></SPAN><SPAN class=dis>
<DIV align=right>{LB_规划}</DIV></SPAN><SPAN class=undis>
<DIV align=right>{LB_培训}</DIV></SPAN><SPAN class=undis>
<DIV align=right>{LB_薪酬} </DIV></SPAN><SPAN class=undis>
<DIV align=right>{LB_招聘}</DIV></SPAN></DIV>
<SCRIPT>
    var Tags=document.getElementById
('NewsTop_tit').getElementsByTagName('p');
    var TagsCnt=document.getElementById
('NewsTop_cnt').getElementsByTagName('span');
    var len=Tags.length;
    var flag=1;//修改默认值
    for(i=1;i<len;i++){
     Tags[i].value = i;
     Tags[i].onmouseover=function(){changeNav
(this.value)};
     TagsCnt[i].className='undis';   
 
    }
    Tags[flag].className='topC1';
    TagsCnt[flag].className='dis';
    function changeNav(v){
     Tags[flag].className='topC0';
     TagsCnt[flag].className='undis';
     flag=v;
     Tags[v].className='topC1';
     TagsCnt[v].className='dis';
    }
   </SCRIPT>
</DIV></DIV><FONT style="BACKGROUND-COLOR: #eef7fc"></FONT></DIV></DIV></DIV>

喜欢的就帮我顶一下~~~谢谢了~~

我顶你，总行了吧？

更麻烦

其实这个很简单，如果做成直接下载的，是不行的，因为这个东西，你可以放到任何的页面，我不可能每个页面都做好放在这里给大家下载吧，这是不现实的~

有什么不明白的，可以直接问我就行了

顶一下

让人再看看这个