针对------ “一个非常简单易用而且兼容非常好的下拉菜单” 的随笔对部分浏览器不兼容的修改

下面先是Style css的代码。只是修改和增加了部分css，对有些浏览器的不兼容，我做了重新的定位

 

 

<style type="text/css">
*{
margin:0px; padding:0px;}/*将所有标签的默认边距等全置为零*/  


#posi{  /*这个是我们新增的一个div，用来将所有的ul li包起来,对导航条的绝对定位，只要是方便移动*/
position:absolute;
top:60px;
left:60px;
width:60px;}

#main_daohang_left li{width:60px;
background-Color:red;}

#main_daohang_left li a,#main_daohang_left li ul li a{
text-decoration:none;}


#main_daohang_left li ul li{
padding-bottom:5px;
padding-top:5px;
vertical-align:middle;
}

#main_daohang_left li,#main_daohang_left li ul li{
list-style:none;} 
#main_daohang_left li div{
display:none;}
#main_daohang_left li#menu:hover div{
display:block;
}
#main_daohang_left li ul li:hover{  
background-color:#DA937D;}
#main_daohang_left li ul,#main_daohang_left li ul li{  
width:60px;
background-color:#487EB5;}

 
#menulist{   /*对下列菜单，我们新加了一个div*，对它进行相对定位*/
position:relative;
padding:0px;
margin:0px;
left:0px;
top:0px;}


</style>

 

 下面是html代码，只要是新增了两个div，用于位置的操作方便

 

<div id="posi">
<ul id="main_daohang_left">


               <li id="menu"><a href="#"><span onMouseOver="d_css(id)" onMouseOut="d_css_out(id)" id="student">第一项</span></a>
                  
                   <!--此处为菜单项-->
                   <div id="menulist">
                                <ul>
                                      <li><a href="#">第1行</a></li>
                                      <li><a href="#">第2行</a></li>
                                      <li><a href="#">第3行</a></li>
                                      <li><a href="#">第4行</a></li>
                                </ul>
                           
                    </div>
                  
               </li>
</ul>
</div>

 

 如果大家有什么不兼容的，欢迎大家来讨论，我们一起来研究一下吧，谢谢了。

 

 

 

 

 

 

 

<style type="text/css">