我给楼主看了一下```你要的效果没说清楚`如果想显示出下拉列表直接删掉 #menu li dd{display:none;
}
就可以了。如果想鼠标移动后,出现下拉列表,我没看到楼主定义这个类型,所以给楼主一个我以前写的,仅供参考。
imcm ul,imcm li,imcm div,imcm span,imcm a{text-align:left;vertical-align:top;padding:0px;margin:0;list-style:none outside none;border-style:none;background-image:none;clear:none;float:none;display:block;position:static;overflow:visible;line-height:normal;}
imcm li a img{display:inline;border-width:0px;}
imcm span{display:inline;}
imcm imclear,imclear{clear:both;height:0px;visibility:hidden;line-height:0px;font-size:1px;}imcm imsc{position:relative;}imcm imsubc{position:absolute;visibility:hidden;}imcm li{list-style:none;font-size:1px;float:left;}imcm ul ul li{width:100;float:left !important;}
imcm a{display:block;position:relative;}
imcm ul imsc,imcm ul imsubc {z-index:10;}
imcm ul ul imsc,imcm ul ul imsubc{z-index:20;}
imcm ul ul ul imsc,imcm ul ul ul imsubc{z-index:30;}
imde ul li:hover imsubc{visibility:visible;}
imde ul ul li:hover
imsubc{visibility:visible;}
imde ul ul ul li:hover
imsubc{visibility:visible;}
imde li:hover ul imsubc{visibility:hidden;}
imde li:hover ul ul imsubc{visibility:hidden;}
imde li:hover ul ul ul imsubc{visibility:hidden;}
imcm imea{display:block;position:relative;left:0px;font-size:1px;line-height:1px;height:0px;width:1px;float:right;}
imcm imea span{display:block;position:relative;font-size:1px;line-height:0px;}dvs,dvm{border-width:0px}/\///imcm imea{visibility:hidden;}//</style><!--[if IE]><style type="text/css">imcm imea span{position:absolute;}imcm imclear,imclear{display:none;}imcm{zoom:1;} imcm li{curosr:hand;} imcm ul{zoom:1}imcm a{zoom:1;}</style><![endif]--><!--[if gte IE 7]><style type="text/css">imcm imsubc{background-image:url(ie_css_fix);}</style><![endif]--><!--end-->
<!--[imstyles] Infinite Menu Styles: Keep this section in the document head for full validation -->
<style type="text/css">
/ --[[ Main Expand Icons ]]-- /
#imenus0 imeam span,#imenus0 imeamj span {background-image:url(bg-daohangSjpg); width:1px; height:12px; left:0px; top:0px; background-repeat:no-repeat;background-position:top left;}
#imenus0 li:hover imeam span,#imenus0 li aiactive imeamj span {background-image:url(bg-daohangSjpg); background-repeat:no-repeat;background-position:top left;}
/ --[[ Sub Expand Icons ]]-- /
#imenus0 ul imeas span,#imenus0 ul imeasj span {background-image:url(stub_arrow_rightgif); width:6px; height:8px; left:0px; top:3px; background-repeat:no-repeat;background-position:top left;}
#imenus0 ul li:hover imeas span,#imenus0 ul li aiactive imeasj span {background-image:url(stub_arrow_rightgif); background-repeat:no-repeat;background-position:top left;}
/ --[[ Main Container ]]-- /
#imouter0 {background-color:#95D4CC; border-style:none; border-color:#CCCCCC; border-width:1px; padding:0px; margin:0px; }
/ --[[ Sub Container ]]-- /
#imenus0 li ul {background-color:#95d4cc; border-style:solid; border-color:#687a54; border-width:1px; padding:5px 8px 5px 5px; margin:0px; }
/ --[[ Main Items ]]-- /
#imenus0 li a, #imenus0 imctitle {height:16px; background-color:#95D4CC; color:#000; text-align:left; font-family:Arial; font-size:12px; font-weight:normal; text-decoration:none; padding:3px 6px 1px; margin:0px 5px 0px 0px; }
/ [hover] - These settings must be duplicated for IE compatibility/
#imenus0 li:hover>a {background-color:#5B9890; text-decoration:none; }
#imenus0 li aihover, imde imenus0 a:hover {background-color:#95d4cc; text-decoration:none; }
/ [active] /
#imenus0 li aiactive {}
/ --[[ Sub Items ]]-- /
#imenus0 ul a, #imenus0 imsubc li imctitle {height:auto; background-color:transparent; color:#000; text-align:left; font-size:11px; font-weight:normal; text-decoration:none; border-style:solid; border-color:#95d4cc; border-width:1px 0px; padding:2px 5px; margin:0px; }
/ [hover] - These settings must be duplicated for IE comptatibility/
#imenus0 ul li:hover>a {background-color:#5B9890; text-decoration:none; border-color:#687a54; }
#imenus0 ul li aihover {background-color:#5B9890; text-decoration:none; border-color:#687a54; }
/ [active] /
#imenus0 ul li aiactive {}
你这是滚动条
你可以用
<asp:textbox ID="Textbox1" TextMode="MultiLine" runat="server"></asp:textbox>
<textarea id="TextArea1" cols="20" rows="2"></textarea>
这俩个 那个都可以 都是多行文本框 可以输入、可以复制、还有滚动条
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 10 Transitional//EN" ">
<html xmlns=">
<head>
<meta >
<title>简单的二级下拉菜单</title>
<style type="text/css">
#FM > li > ulfm{ display:none;}
#FM > li:hover >ulfm{ display:block;}
</style>
</head>
<body>
</body>
</html>
<body>
<ul id="FM">
<li><a href="#">首页</a>
<ul class="fm">
<li><a href="#">这是二级菜单</a></li>
<li><a href="#">这是二级菜单</a></li>
</ul>
</li>
<li><a href="#">关于我们</a>
<ul class="fm">
<li><a href="#">这是二级菜单</a></li>
<li><a href="#">这是二级菜单</a></li>
</ul>
</li>
</li>
</ul>
</body>
</html>
所作出来的效果为:
这样子就很快的用css实现简单的二级下拉菜单啦!
以上就是关于css下拉菜单代码全部的内容,包括:css下拉菜单代码、帮看下这样的是下拉菜单吗求一个CSS的这样的菜单代码。、css怎样实现简单的二级下拉菜单等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)