標籤：php三級導航
首先看看：
1.資料設定檔 db.php
<?phpreturn array(array(‘one‘ => ‘關於我們‘,‘two‘ => array(array(‘three_tit‘ => ‘公司介紹‘,‘three_cont‘ => array(‘企業概況‘,‘組織架構‘,‘發展曆程‘,‘企業文化‘,‘服務理念‘)),array(‘three_tit‘ => ‘企業榮譽‘,‘three_cont‘ => array(‘獲獎認證‘,‘行業貢獻‘,‘資質認證‘,‘協會活動‘,‘公司的成就‘)),array(‘three_tit‘ => ‘銷售網路‘,‘three_cont‘ => array(‘東北‘,‘華北‘,‘中東‘,‘華南‘,‘西南‘,‘西北‘)))),array(‘one‘ => ‘產品展示‘,‘two‘ => array(array(‘three_tit‘ => ‘進出口貿易‘,‘three_cont‘ => array(‘數位產品‘,‘最新能源‘,‘新鮮水果‘,‘肉類食品‘,‘衣服‘,‘金銀首飾‘)),array(‘three_tit‘ => ‘商務服務‘,‘three_cont‘ => array(‘資格認證‘,‘人才培養‘,‘熱門商品推薦‘,‘最新科技前沿‘)))),array(‘one‘ => ‘新聞中心‘,‘two‘ => array(array(‘three_tit‘ => ‘企業動態‘,‘three_cont‘ => array(‘公司新聞‘,‘新品上市‘,‘企業動態‘)),array(‘three_tit‘ => ‘行業動態‘,‘three_cont‘ => array(‘媒體聚焦‘,‘業內關注‘,‘國內行情‘,‘國際行情‘)))),array(‘one‘ => ‘聯絡我們‘,‘two‘ => array(array(‘three_tit‘ => ‘連絡方式‘,‘three_cont‘ => array(‘線上客服‘,‘通訊地址‘,‘電話傳真‘,‘線上留言‘)),array(‘three_tit‘ => ‘人才招聘‘,‘three_cont‘ => array(‘專案經理‘,‘助理秘書‘,‘渠道代理‘,‘網站工程師‘)))));?>
<?phpheader(‘Content-type:text/html;charset=utf-8‘); // 載入資料$data = include ‘./db.php‘; // 載入html檔案include ‘./nav.html‘;?>
<!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" /><script type="text/javascript" src="./js/jquery-1.7.2.min.js"></script><script type="text/javascript">$(function(){//對元素進行隱藏$(‘.menu>li‘).eq(4).find(‘s‘).hide();$(‘.two li‘).last().css(‘border‘,‘none‘);//滑鼠移入和移出事件$(‘.menu li‘).hover(function(){$(this).find(‘.two‘).show();//滑鼠移入和移出事件$(‘.two li‘).hover(function(){$(this).find(‘.hide‘).show();},function(){$(this).find(‘.hide‘).hide();});},function(){$(this).find(‘.two‘).hide();});})</script><title>無標題文檔</title><style type="text/css">*{padding: 0; margin: 0;}body{font: 18px/50px ‘微軟雅黑‘; color: #FFF;}li{list-style: none;}a{text-decoration: none; color: #FFF;}#nav{width: 610px; height: 50px; background: #01532B; margin: 30px auto; border-radius: 5px; box-shadow: 2px 3px 2px #479E33; }#nav ul.menu{padding: 0 5px;}#nav ul.menu li{width: 120px; height: 50px; line-height: 50px; text-align: center; float: left; position: relative;}#nav ul.menu li a{display: block; text-shadow:0px 1px 1px #479E33;}#nav ul.menu li a:hover{color: #FFF; background: #479E33;}#nav ul.menu li s{width: 0px; height: 30px; border-left: 1px solid #479E33; display: block; position: absolute; right: 0; top: 10px;}#nav ul.menu li ul{position: absolute; top: 50px; left: 0; background: #479E33; border-radius: 0 0 3px 3px; box-shadow: 2px 3px 2px #479E33;}#nav ul.menu li ul li{border-bottom: 1px solid #479E33; width: 120px; position: relative;}#nav ul.menu li ul li a{font-size: 16px;}#nav ul.menu li ul li .hide{position: absolute; top: 0px; left: 120px;}#nav ul.menu li ul li .hide li{border-left: 1px solid #479E33;}#nav ul.menu li ul li .hide li a{font-size: 14px;}.two,.hide{display: none;}</style></head><body><div id="nav"><ul class="menu"><li><a href="">網站首頁</a><s></s></li><?php foreach($data as $v) { ?><li><a href=""><?php echo $v[‘one‘] ?></a><s></s><ul class="two"><?php foreach ($v[‘two‘] as $val) { ?><li><a href=""><?php echo $val[‘three_tit‘] ?></a><ul class="hide"><?php foreach ($val[‘three_cont‘] as $value) { ?><li><a href=""><?php echo $value ?></a></li><?php } ?></ul></li><?php } ?></ul></li><?php } ?></ul></div></body></html>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
