Heim > Web-Frontend > HTML-Tutorial > 请大家给我看看这个下拉菜单到底怎么了_html/css_WEB-ITnose

请大家给我看看这个下拉菜单到底怎么了_html/css_WEB-ITnose

WBOY
Freigeben: 2016-06-24 12:12:47
Original
1008 Leute haben es durchsucht

<!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 runat="server">    <title>123</title>    <link href="style.css"  rel="stylesheet" type="text/css" /><!-- saved from url=(0013)about:internet --></head><div id="bar">	<div id="nav">	<ul>		<li><a href="#" target="_blank">网站主页</a>				</li>		<li><a href="#" target="_blank">文档管理</a>			<ul style="z-index:88;">				<li>类别管理</li>				<li>信息管理</li>				<li>文档下载</li>				<li>文档上传</li>			</ul>		</li>		<li><a href="#" target="_blank">用户管理</a>			<ul style="z-index:99;">				<li>用户管理</li>				<li>用户管理</li>				<li>用户管理</li>				<li>用户管理</li>				<li>用户管理</li>			</ul>		</li>		<li><a href="#" target="_blank">留言建议</a>		</li>	</ul>	</div></div>   </body></html>
Nach dem Login kopieren


a{	text-decoration:none;}#bar{	width:100%;	height:40px;	z-index:999;	padding-top:5px;	background:url(bar_bg.gif) repeat-x; 	}#nav{	width:960px;	height:30px;	margin:0 auto;	}#nav ul {	padding:0; 	margin:0;         list-style-type: none;	}#nav ul li{	list-style:none;	float:left;	position:relative;	width:100px;	}#nav ul li a{	display:block;	text-align:center;	line-height:28px;	padding-left:9px;	padding-right:9px;	color:#bdbde2;	height:30px;         }#nav ul li:hover a{	background-color:#000066;	color:#00FF99;	}#nav ul li ul {	display: none;	}#nav ul li:hover ul {	display:block; 	top:30px; 	position:absolute; 	width:80px;         color:#00FF99;	text-align:center;         }#nav ul li:hover ul li {	background-color:#333333;	display:block;	color:#bdbde2;	height:28px;	padding-top:4px;	width:100px;	}#nav ul li:hover ul li a {	display:block;	color:#bdbde2;	background:#1C5579; 	}#nav ul li:hover ul li a:hover {	background-color:#000066;	color:#00FF99;	}
Nach dem Login kopieren


这是源码请高手看一下


回复讨论(解决方案)

木有感?你的感?...你有啥感?大??出?.

楼主是不是在ie6下 看的效果?

要问 为什么 li:hover 无反应?

ie6支持除a之外的伪类,可以用js来做,onmouseover 与 onmouseout

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage