返回没什么可以说的......登陆

没什么可以说的,直接上例子

Mr.Lv2019-06-13 13:14:2553
<!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=utf-8" /><title>企业网站下拉式导航栏示例</title><link rel="stylesheet" type="text/css" href="style/comm.css"/><link rel="stylesheet" type="text/css" href="style/layout.css"/><script type="text/javascript" src="script/jquery-1.4.2.min.js"></script><script type="text/javascript">$(function(){
    $("#nav>ul>li").hover(function(){
        $(this).children("ul").show();
        },function(){
        $(this).children("ul").hide();    
            
            });
    });</script></head><body><div id="wrap">
 
  <div id="nav">
    <ul>
       <li><a href="#">网站首页</a>
         <ul>
           <li><a href="#" alt="访问公司博客">公司博客</a></li>
           <li><a href="#">公司论坛</a></li>
         </ul>
        </li> 
      <li><a href="#">关于我们</a>
         <ul>
            <li><a href="#">公司新闻</a></li>
           <li><a href="#">我们的宗旨</a></li>
           <li><a href="#" >服务内容</a></li> 
         </ul>     
      </li>
      <li><a href="#">网站新闻</a>
         <ul>
           <li><a href="#">行业动态</a></li>
           <li><a href="#">公司新闻</a></li> 
         </ul>          
       </li>
      <li><a href="#">作品展示</a>
         <ul>
           <li><a href="#">网站作品</a></li>
           <li><a href="#">flash作品</a></li> 
           <li><a href="#">AI作品</a></li>
           <li><a href="#">插画设计</a></li> 
         </ul>          
      
      </li>
      <li><a href="#">项目报价</a>
         <ul>
           <li><a href="#">网站作品报价</a></li>
           <li><a href="#">flash作品报价</a></li> 
           <li><a href="#">AI作品报价</a></li>
           <li><a href="#">插画设计报价</a></li> 
         </ul>          
      </li>
      <li><a href="#">联系方式</a>
         <ul>
           <li><a href="#">站内留言</a></li>
           <li><a href="#">联网方式</a></li> 
           <li><a href="#">电话号码</a></li>
           <li><a href="#">公司地址</a></li> 
         </ul>          
      </li>
  </ul>
  </div></div></body></html>
@charset "utf-8";
/* CSS Document */
/*
用户重置常规样式
*/
*{margin:0;
padding:0}

body{
    font-size:62.5%;    
    }
    
a{ text-decoration:none;}

ul,ol{ list-style-type:none;}        

table{border-collapse:collapse;border-spacing:0;}

fieldset,img{border:0;}
@charset "utf-8";
/* CSS Document */
#wrap{
    width:1000px;
    margin:0 auto;
    }
#nav{
    font-family:"微软雅黑";
    font-size:1.5em;
    height:30px;
    background:rgb(195,218,249);
    }
#nav ul{width:100%;background:rgb(195,218,249);}
#nav ul li{float:left; position:relative;}
#nav ul li a{display:block;width:120px;height:30px;line-height:30px; text-align:center; background:rgb(195,218,249);color:#000;}    
#nav ul li a:hover{background:rgb(255,229,179);color:#000;}
#nav ul li ul{ position:absolute;top:30px;left:0px; display:none;border:1px solid #ccc;margin-bottom:-3px;width:120px;}
#nav ul li ul li{float:none; border-bottom:1px solid #ccc;}
#nav ul li ul li a{background:rgb(246,246,246);color:#000;display:block;}
#nav ul li ul li a:hover{background:rgb(255,229,179);color:#000;}


最新手记推荐

• 用composer安装thinkphp框架的步骤• 省市区接口说明• 用thinkphp,后台新增栏目• 管理员添加编辑删除• 管理员添加编辑删除

全部回复(0)我要回复

暂无评论~
  • 取消回复发送
  • PHP中文网