左侧菜单
Posted 树叶的一生
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了左侧菜单相关的知识,希望对你有一定的参考价值。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" href="css/bootstrap.css" /> <style> #left_container1 {float: left;width: 244px;margin-top: 10px;} #left_tree_container {border: solid 1px #ccc;background-color: #eff9ff;} #left_tree_container .headline{height:34px; background-color:#0066c8; margin:0 auto; line-height:34px; color:#fff; font-weight:bold; text-align:left;padding-left: 15%; font-size:14px;} #left_tree_container a:link {color: #000;text-decoration: none;} #left_tree_container a:visited {color: #000;text-decoration: none;} #left_tree_container a:hover,#left_tree_container a:active {color: #0080dc;text-decoration: none;} #left_tree_container .left1_nav_L2 {background-color: #eff9ff;position: absolute;z-index: 8888;margin-left: 242px;*margin-left: -1px;border: solid 1px #CCCCCC;border-left: solid 1px #ccc;border-bottom: 0px;display: none;margin-top: -1px;} #left_tree_container .submenu {width:242px;vertical-align:bottom; line-height:31px; height:31px;overflow:hidden; border-bottom:solid 1px #cccccc;} #left_tree_container .submenuA{float:left;overflow:hidden; width:232px;_width:233px;padding-left:10px;} #left_tree_container li {margin: 0px;padding: 0px;border: 0px;list-style: none;} #left_tree_container ul {padding-left: 0px;} .left1_nav_L2 {display:none;} .clear{clear:both; height:0; line-height:0; font-size:0;} #left_container1 .left_tree_down{ height:348px; border:solid 1px #ccc; margin-top:15px;} #left_container1 .left_tree_down .links{height:37px;background-color:#006dce; margin:1px 1px 0px 1px; line-height:37px; color:#fff; font-weight:bold; text-align:left; padding-left:10%; font-size:14px;} </style> </head> <body> <div style=" float:left; width:244px;"> <div id="left_container1" style=""> <div id="left_tree_container" style="padding-top:1px;"> <div class="headline"> Category </div> <script type="text/javascript"> function up1(k) { document.getElementById(k).style.display = ‘block‘; } function down1(k) { document.getElementById(k).style.display = ‘none‘; } </script> <div style="height:1437px; overflow:hidden;"> <ul> <li class="submenu" onclick="opensub(0)" onmouseover="up1(‘kind0‘)" onmouseout="down1(‘kind0‘)"> <a class="submenuA" href="#" title="Robot">> Robot(1222)</a> <ul class="left1_nav_L2" id="kind0"> <li style="width: 210px; padding-left: 10px; line-height: 31px; height: 31px; border-bottom: 1px solid #cccccc; background-color: #eff9ff;" onmouseover="this.style.backgroundColor=‘#fff‘;" onmouseout="this.style.backgroundColor=‘#eff9ff‘;"> <a href="#" style="color:#000;">B/O ROBOT</a> (3820) </li> <li style="width: 210px; padding-left: 10px; line-height: 31px; height: 31px; border-bottom: 1px solid #cccccc; background-color: #eff9ff;" class="threemeun" onmouseover="this.style.backgroundColor=‘#fff‘;" onmouseout="this.style.backgroundColor=‘#eff9ff‘;"> <a href="#" style="color:#000;">TRANSFORMER toys</a> (2154) </li> </ul> <div class="clear"></div> </li> <li class="submenu" onclick="opensub(0)" onmouseover="up1(‘kind1‘)" onmouseout="down1(‘kind1‘)"> <a class="submenuA" href="#" title="Robot">>Robot(1222)</a> <ul class="left1_nav_L2" id="kind1"> <li style="width: 210px; padding-left: 10px; line-height: 31px; height: 31px; border-bottom: 1px solid #cccccc; background-color: #eff9ff;" onmouseover="this.style.backgroundColor=‘#fff‘;" onmouseout="this.style.backgroundColor=‘#eff9ff‘;"> <a href="#" style="color:#000;">B/O ROBOT</a> (3820) </li> <li style="width: 210px; padding-left: 10px; line-height: 31px; height: 31px; border-bottom: 1px solid #cccccc; background-color: #eff9ff;" class="threemeun" onmouseover="this.style.backgroundColor=‘#fff‘;" onmouseout="this.style.backgroundColor=‘#eff9ff‘;"> <a href="#" style="color:#000;">TRANSFORMER toys</a> (2154) </li> </ul> <div class="clear"></div> </li> </ul> </div> </div> <!--left_tree_container END--> <div class="left_tree_down"> <div class="links"> LINKS </div> <a href="http://qstoys.en.alibaba.com/" target="_blank"><img src="../../Content/images/link.jpg" alt="" style=" display:block; margin:10px auto 0 auto;"></a> </div> </div> <div style=" height:570px; border:solid 1px #ccc; "> <div style=" height:34px; background-color:#46c256; margin:1px 1px 0px 1px; padding-left:25px; line-height:34px; color:#fff; font-weight:bold; font-size:14px;"> LASTEST PRODUCTS </div> <div style=" text-align: left; padding-left:15px; padding-top:15px; "> <div style=" padding-left:10px; font-size:13px; height:30px; margin-bottom:15px;"> <a href="/En/Products/1?action=ShowData&parameters=2017-12-06" style=" float:left; border:solid 1px #46c256; margin:0px 19px 0px 0px; height:20px; line-height:20px; padding:0px 5px 0px 5px;">2017-12-06</a><a href="/En/Products/1?action=ShowData&parameters=2017-12-05" style=" float:left; border:solid 1px #46c256; margin:0px 19px 0px 0px; height:20px; line-height:20px; padding:0px 5px 0px 5px;">2017-12-05</a><a href="/En/Products/1?action=ShowData&parameters=2017-12-04" style=" float:left; border:solid 1px #46c256; margin:0px 19px 0px 0px; height:20px; line-height:20px; padding:0px 5px 0px 5px;">2017-12-04</a><a href="/En/Products/1?action=ShowData&parameters=2017-12-02" style=" float:left; border:solid 1px #46c256; margin:0px 19px 0px 0px; height:20px; line-height:20px; padding:0px 5px 0px 5px;">2017-12-02</a><a href="/En/Products/1?action=ShowData&parameters=2017-12-01" style=" float:left; border:solid 1px #46c256; margin:0px 19px 0px 0px; height:20px; line-height:20px; padding:0px 5px 0px 5px;">2017-12-01</a><a href="/En/Products/1?action=ShowData&parameters=2017-11-30" style=" float:left; border:solid 1px #46c256; margin:0px 19px 0px 0px; height:20px; line-height:20px; padding:0px 5px 0px 5px;">2017-11-30</a><a href="/En/Products/1?action=ShowData&parameters=2017-11-29" style=" float:left; border:solid 1px #46c256; margin:0px 19px 0px 0px; height:20px; line-height:20px; padding:0px 5px 0px 5px;">2017-11-29</a> </div> <iframe frameborder="0" marginheight="0" marginwidth="0" style=" clear:both; width:670px; height:470px;" scrolling="auto" src="/En/pronew/1"> </iframe> </div> </div> </body> </html>
以上是关于左侧菜单的主要内容,如果未能解决你的问题,请参考以下文章