sougou影视导航菜单

http://bbs.blueidea.com/thread-2851302-1-1.html

在看视频的时候，觉得这个导航挺不错，可以学习学习！希望对大家有点用处。

• 首页
• 品牌展播
• 排行榜
• VIP客户
• 创意专题
• 品牌活动

<! 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"   />
< style >
    #menu {}{ height:47px; width:980px; background:url(http://v.gougou.com/brand/img/hd/nav.gif) no-repeat; clear:both; overflow:hidden; position:relative; margin-top:50px;}
        #menu ul {}{ margin-left:10px; }
        #menu li {}{ float:left; height:36px; margin:8px 0 0; padding:0 10px; background:url(http://v.gougou.com/brand/img/hd/line.gif) no-repeat 100% 12px; }
        #menu li.nobg {}{ background:none; }
        #menu li a {}{ float:left; display:block; height:36px; background:url(http://v.gougou.com/brand/img/hd/nav_item.gif) no-repeat; text-indent:-999px; overflow:hidden; }
        #menu li a.n1 {}{ background-position:left top; width:77px;}
        #menu li.selected a.n1,#menu li a.n1:hover {}{ background-position:left -36px;  }
        #menu li a.n2 {}{ background-position:-77px top; width:97px;}
        #menu li.selected a.n2,#menu li a.n2:hover {}{ background-position:-77px -36px;  }
        #menu li a.n3 {}{ background-position:-174px top; width:87px;}
        #menu li.selected a.n3,#menu li a.n3:hover {}{ background-position:-174px -36px;  }
        #menu li a.n4 {}{ background-position:-261px top; width:92px;}
        #menu li.selected a.n4,#menu li a.n4:hover {}{ background-position:-261px -36px;  }
        #menu li a.n5 {}{ background-position:-353px top; width:97px;}
        #menu li.selected a.n5,#menu li a.n5:hover {}{ background-position:-353px -36px;  }
        #menu li a.n6 {}{ background-position:-450px top; width:97px;}
        #menu li.selected a.n6,#menu li a.n6:hover {}{ background-position:-450px -36px;  }
</ style >
< title > sougou影视导航菜单 </ title >
</ head >
< body >
< p > 在看视频的时候，觉得这个导航挺不错，可以学习学习！希望对大家有点用处。 </ p >
         < div  id ="menu" >
             < ul >
                 < li >< a  href ="http://www.showwho.com/"  class ="n1" > 首页 </ a ></ li >
                 < li >< a  href ="http://www.showwho.com/"  class ="n2" > 品牌展播 </ a ></ li >
                 < li >< a  href ="http://www.showwho.com/"  class ="n3" > 排行榜 </ a ></ li >
                 < li >< a  href ="http://www.showwho.com/"  class ="n4" > VIP客户 </ a ></ li >
                 < li >< a  href ="http://www.showwho.com/"  class ="n5" > 创意专题 </ a ></ li >
                 < li  class ="nobg" >< a  href ="http://www.showwho.com/"  class ="n6" > 品牌活动 </ a ></ li >
             </ ul >
         </ div >
</ body >
</ html >

转载于:https://www.cnblogs.com/CB/archive/2008/05/02/1179193.html