CSS JavaScript DOM写的仿谷瀑网搜索导航

来源：互联网发布：网络诈骗根本抓不到编辑：程序博客网时间：2024/04/29 16:05
<!doctype html><html><head><meta charset="utf-8"><title>无标题文档</title><style type="text/css">.wrap{margin:0 auto;border:1px solid #FFF;}.menu {width: 80%;height: 40px;margin: 0 auto;margin-top: 50px;border-top:1px solid #F1F1F1;}.menuin {padding: 0;margin: 0;float: left;}.menu3 {float: right;}.menuin ul {padding: 0;margin: 0;list-style: none;}.menu ul li a {text-decoration: none;color: #000;font-weight: bold;font-size: 14px;}.menu ul li a:hover {color: RGB(178,0,0);}.menuin ul li {float: left;text-align: center;width: 100px;line-height: 40px;border-top:3px solid #FFF;}.menu3{background-color:#F2F2F2;line-height:40px;}.menu3 a{text-decoration:none;font:Arial, Helvetica, sans-serif;font-size:12px;padding:0 9px;color:#999999;border-right:1px solid #999999;}.menu3 a:hover{color:#b20000;}.banner_list5{width:80%;height:137px;margin:0 auto;background-image:url(cxz.bmp);background-repeat:no-repeat;}.cl{clear:both;}</style><script>var m=document.getElementsByTagName("li");function moveOver(cnt){m[cnt].style.borderTop="3px solid #000000";}function moveOut(cnt){m[cnt].style.borderTop="";}</script></head><body><div class="werap"><div class="menu">  <div class="menuin">    <ul>      <li><a href=# onMouseOver="moveOver(0)" onMouseOut="moveOut(0)">首页</a></li>      <li><a href=# onMouseOver="moveOver(1)" onMouseOut="moveOut(1)">环宝通</a></li>      <li><a href=# onMouseOver="moveOver(2)" onMouseOut="moveOut(2)">建站服务</a></li>      <li><a href=# onMouseOver="moveOver(3)" onMouseOut="moveOut(3)">广告服务</a></li>      <li><a href=# onMouseOver="moveOver(4)" onMouseOut="moveOut(4)">应用市场</a></li>      <li><a href=# onMouseOver="moveOver(5)" onMouseOut="moveOut(5)">联系我们</a></li>    </ul>  </div>  <div class="menu3"> <a href=#>加入谷瀑供应商</a> <a href=#>加入谷瀑采购商</a> </div></div><div class="cl"></div><div class="banner_list5"></div></div></body></html>
0 0