Rumah > hujung hadapan web > html tutorial > 二级导航为嘛显示不了?_html/css_WEB-ITnose

二级导航为嘛显示不了?_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
Lepaskan: 2016-06-24 12:17:22
asal
1370 orang telah melayarinya

   无法二级导航无法覆盖到之上

<!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" /><meta name="keywords" content="WOW Hotel" /> <meta name="description" content="WOW Hotel" /> <link rel="stylesheet" type="text/css" href="css/style.css" /> <title>WOW Hotel  --  Home</title> <script type="text/javascript">function showmenu(elmnt){	document.getElementById(elmnt).style.display = "block";}function hidemenu(elmnt){	document.getElementById(elmnt).style.display = "none";}</script></head><body><!--顶端样式--><div id="top">   <!--头部样式-->       <div id="header">             <div id="logo"><img  src="images/BfAVS0Lk.png"    style="max-width:90%"  style="max-width:90%"/ alt="二级导航为嘛显示不了?_html/css_WEB-ITnose" ></div>			 <div id="logon_text"></div>  </div>    <!--导航样式-->   <div id="nav">          		  <div id="nav_bg">            <div class="nav_top">			   <ul> 			      <li><a href="index.html">Home</a></li>                   <li onmouseover="showmenu('tutorials2')" onmouseout="hidemenu('tutorials2')"><a href="#">Packages</a>				            <ul class="menu" id="tutorials2" style="display:none;">							<li class="menu"><a href="#">1</a></li>							<li class="menu"><a href="#">2</a></li>							<li class="menu"><a href="#">3</a></li>							<li class="menu"><a href="#">4</a></li>							</ul>				 </li>                   <li onmouseover="showmenu('menus2')" onmouseout="hidemenu('menus2')"><a href="#">Rooms</a>				      	 <ul class="menu" id="menus2" style="display:none;">							<li class="menu"><a href="#">1</a></li>							<li class="menu"><a href="#">2</a></li>							<li class="menu"><a href="#">3</a></li>							<li class="menu"><a href="#">4</a></li>						 </ul>				  </li>			      <li onmouseover="showmenu('menus3')" onmouseout="hidemenu('menus3')"><a href="#">Entertainment</a>				       	<ul class="menu" id="menus3" style="display:none;">							<li class="menu"><a href="#">1</a></li>							<li class="menu"><a href="#">2</a></li>							<li class="menu"><a href="#">3</a></li>							<li class="menu"><a href="#">4</a></li>						 </ul> 				  </li>                   <li onmouseover="showmenu('menus4')" onmouseout="hidemenu('menus4')"><a href="#">Server</a>				       	 <ul class="menu" id="menus4" style="display:none;">							<li class="menu"><a href="#">1</a></li>							<li class="menu"><a href="#">2</a></li>							<li class="menu"><a href="#">3</a></li>							<li class="menu"><a href="#">4</a></li>						 </ul> 				  </li>                   <li onmouseover="showmenu('menus5')" onmouseout="hidemenu('menus5')"><a href="#">BBS</a>				      	<ul class="menu" id="menus5" style="display:none;">							<li class="menu"><a href="#">1</a></li>							<li class="menu"><a href="#">2</a></li>							<li class="menu"><a href="#">3</a></li>							<li class="menu"><a href="#">4</a></li>						 </ul> 				  </li>                   <li onmouseover="showmenu('menus6')" onmouseout="hidemenu('menus6')"><a href="#">Contact</a>				      	  <ul class="menu" id="menus6" style="display:none;">							<li class="menu"><a href="#">1</a></li>							<li class="menu"><a href="#">2</a></li>							<li class="menu"><a href="#">3</a></li>							<li class="menu"><a href="#">4</a></li>						 </ul> 				  </li>                </ul> 			   </div>			 </div>   <div id="banner">     <img  src="images/banner.jpg" / alt="二级导航为嘛显示不了?_html/css_WEB-ITnose" >	</div>   </div></div><!--main--><div id="main"><div id="i_left">    <div>	<h3 class="blk_t">Navigation</h3> 	  <ul> 	    			  <li><a href="sp.html">Spend a weekend</a></li>					  <li><a href="sp.html">Anywhere sale</a></li>					  <li><a href="sp.html">Breakfast package</a></li>					  <li><a href="sp.html">Romance package</a></li>	   	   	   </ul>	  	  	  </div></div><div id="center"></div><div id="i_right"></div></div><!--footer--><div id="footer"></div></body></html>
Salin selepas log masuk



/*-----------------------------------// 全局样式 //-----------------------------------*/body{ margin:0px; padding:0px; background-image:url(../images/top_bg.jpg); background-repeat: repeat-x;  font:12px/180% Arial,"宋体",Helvetica, sans-serif,Verdana;}/*--- top ---*/#top{ width:100%; height:471px; margin:0px auto;  }/*-----------------------------------// 头部样式 //-----------------------------------*/#header{ width:940px; height:100px; margin:0px auto; overflow: hidden; }#logo{ float:left;}#logon_text{}/*-----------------------------------// 导航样式 //-----------------------------------*/#nav{ margin:0px auto; }#nav_bg{ margin:0px auto; width:940px; height:42px; background:url(../images/nav_right.gif) no-repeat;}.nav_top ul{ margin:0px; padding:0px; list-style-type:none; }.nav_top ul li{ float:left;line-height: 42px; width:120px; text-decoration:none; text-align:center;}.nav_top li a,.nav_top li a:visited{display: block; text-decoration: none;color:#fff; font-weight: bold; font-size:13px;}.nav_top ul li a:hover{background:url(../images/menu_hover.gif) no-repeat;}.menu {background:url(../images/menu_hover.gif) no-repeat; position:absolute;}.menu li{list-style:none; }#banner{ clear:both;margin:0px auto; margin-top:4px; width:940px;}/*--- 主体页面 ---*/#main{ width:980px; height:481px; margin:0px auto; margin-top:3px;  border:1px solid #070707;}/*-----------------------------------// 首页 //-----------------------------------*//*----// 左侧 //----*/#i_left{ float:left; width:210px;}/*----// 居中 //----*/#center{ float:left; width:498px;}/*----// 右侧 //----*/#i_right{float:left; width:210px;}/*footer*/#footer{ width:940px; height:49px; margin:0px auto; border:1px solid #070707;}
Salin selepas log masuk


回复讨论(解决方案)

你只是让你的导航隐藏,而没有把二级导航的值赋给一级导航。

好吧 我本不想回答的。但是..... 楼主 你把  2级导航的 ul 跟 li 设置的class 是一样的 用一个属性去控制....... 解决的办法很简单 去掉 2级导航的 li的class 或者 更改你会发现原来 一切都那么简单......

记得结贴

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan