HTML怎么做这个下拉菜单
select标签实现。 注：如果是联动下拉菜单的话，需要通过js动态处理select中的option纯css三级下拉菜单，下面是样式表/* common styling */ .menu {font-family: arial, sans-serif; width:750px; position:relative; margin:0; font-size:11px; margin:50px 0;} .menu ul li a, .menu ul li a:visited {display:block; text-decoration:none; color:#000;width:104px; height:20px; text-align:center; color:#fff; border:1px solid #fff; background:#710069; line-height:20px; font-size:11px; overflow:hidden;} .menu ul {padding:0; margin:0;list-style-type: none; } .menu ul li {float:left; margin-right:1px; position:relative;} .menu ul li ul {display: none;} /* specific to non ie browsers */ .menu ul li:hover a {color:#fff; background:#36f;} .menu ul li:hover ul {display:block; position:absolute; top:21px; left:0; width:105px;} .menu ul li:hover ul li a.hide {background:#6a3; color:#fff;} .menu ul li:hover ul li:hover a.hide {background:#6fc; color:#000;} .menu ul li:hover ul li ul {display: none;} .menu ul li:hover ul li a {display:block; background:#ddd; color:#000;} .menu ul li:hover ul li a:hover {background:#6fc; color:#000;} .menu ul li:hover ul li:hover ul {display:block; position:absolute; left:105px; top:0;} .menu ul li:hover ul li:hover ul.left {left:-105px;}
HTML怎么做这个下拉菜单
select标签实现。注：如果是联动下拉菜单的话，需要通过js动态处理select中的option纯css三级下拉菜单，下面是样式表/*commonstyling*/.menu{font-family:arial,sans-serif;width:750px;position:relative;margin:0;font-size:11px;margin:50px0;}.menuullia,.menuullia:visited{display:block;text-decoration:none;color:#000;width:104px;height:20px;text-align:center;color:#fff;border:1pxsolid#fff;background:#710069;line-height:20px;font-size:11px;overflow:hidden;}.menuul{padding:0;margin:0;list-style-type:none;}.menuulli{float:left;margin-right:1px;position:relative;}.menuulliul{display:none;}/*specifictononiebrowsers*/.menuulli:hovera{color:#fff;background:#36f;}.menuulli:hoverul{display:block;position:absolute;top:21px;left:0;width:105px;}.menuulli:hoverullia.hide{background:#6a3;color:#fff;}.menuulli:hoverulli:hovera.hide{background:#6fc;color:#000;}.menuulli:hoverulliul{display:none;}.menuulli:hoverullia{display:block;background:#ddd;color:#000;}.menuulli:hoverullia:hover{background:#6fc;color:#000;}.menuulli:hoverulli:hoverul{display:block;position:absolute;left:105px;top:0;}.menuulli:hoverulli:hoverul.left{left:-105px;}
