CSS代码精简的二级菜单

2024-09-05 12:20:38

字体：大中小

来源：转载

供稿：网友

代码精简的二级菜单，代码确实够精简的，CSS也没几行，JS代码也很少，值得借鉴，呵呵，喜欢朋友们好好研究研究…………

<!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><title>二级菜单</title><style type="text/css">*{margin:0; padding:0}body{width:960px; margin:20px auto; font-size:14px;}/*导航条*/#nav {background-color:blue; color:#fff;height:25px;line-height:25px;text-align:center;list-style:none;}	#nav a{color:#fff;}	#nav li{width:75px;float:left;position:relative;z-index:1;}	#nav li .title{display:block;}	#nav li .title:hover{background-color:green;}	#nav li .submenu{width:75px;margin:0 auto;background:green;position:absolute;left:0;top:25px;display:none;}	#nav li .submenu dd{border-top:1px dotted #ddd;color:#fff;}</style></head><body><ul id="nav">		<li class="menu">			国家政务			<dl class="submenu">				<dd>时政要闻</dd>				<dd>远程党教</dd>				<dd>村务管理</dd>			</dl>		</li>		<li>			网络服务		</li>		<li class="menu">			信息交流			<dl class="submenu">				<dd>求购信息</dd>				<dd>转让信息</dd>			</dl>		</li></div><script type="text/javascript"></script></body></html>

上一篇：滑动TAB，滑动门，CSS+Js代码

下一篇：jQuery 让你的Tab菜单滚动的代码

学习交流

如何查找有故障的配件

如何查找有故障的配件...

热门图片

猜你喜欢的新闻

猜你喜欢的关注