为什么鼠标移到了LI上那个悬浮层没显示出来呢？
<!DOCTYPE html>
<html dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
body{
padding:0;
font-size:10pt;
}
.topmenu{
dsiplay:block;
width:220px;
border:2px solid #e4393c;
margin:0;
padding:0;
}
.toptitle{
height:40px;
line-height:40px;
text-align:left;
font-size:11pt;
font-weight:bold;
color:White;
background:#e4393c;
padding-left:20px;
}
.topmenu li{
height:30px;
line-height:30px;
font-size:11pt;
list-style-type:none;
text-align:left;//左对齐
padding-left:8px;
z-index:3;
background-image:url(http://img1.sycdn.imooc.com//5411027300014f0200220030.jpg);
background-repeat:no-repeat;
background-position:right;
}
.topmenu li a{
text-decoration:none;
color:#313131;
}
.topmenu li:hover{
border:1px solid #DDD;
border-right:0;
box-shadow:0 0 8px #DDD;
-moz-box-shadow: 0 0 8px #DDD;
-webkit-box-shadow: 0 0 8px #DDD;
background-image:none;
}
.topmenu li a:hover{
text-decoration:underline;
font-weight:bold;
color:#e4393c;
}
.submenu{
display:none;
width:715px;
left:220px;
position:absolute;
top:40px;
border: 1px solid #DDD;
z-index:4;
background:White;
box-shadow:0 0 8px #DDD;
-moz-box-shadow: 0 0 8px #DDD;
-webkit-box-shadow: 0 0 8px #DDD;
}
.leftdiv{
background:gray;
float:left;
width:490px;
margin:5px;
}
.rightdiv{
background:blue;
float:left;
width:200px;
margin:5px;
}
.topmenu li:hover.submenu{
display: block;
}
.topmenu li:hover span{
background:white;
display:inline-block;
z-index:20;
width:20px;
height:30px;
float:right;
position:relative;
}
</style>
</head>
<body>
<ul class="topmenu">
<div class="toptitle">
全部商品分类
</div>
<li><a href="#">图书</a>
<div class="submenu">
<div class="leftdiv">
左侧二级分类<br/>
左侧二级分类<br/>
左侧二级分类<br/>
左侧二级分类<br/>
左侧二级分类<br/>
左侧二级分类<br/>
</div>
<div class="rightdiv">
右侧二级分类<br/>
右侧二级分类<br/>
右侧二级分类<br/>
右侧二级分类<br/>
右侧二级分类<br/>
右侧二级分类<br/>
</div>
</div>
</li>
<li><a href="#">家用电器</a></li>
<li><a href="#">手机</a></li>
<li><a href="#">电脑</a></li>
<li><a href="#">家居</a></li>
<li><a href="#">服饰内衣</a></li>
<li><a href="#">个护化妆</a></li>
<li><a href="#">箱包</a></li>
<li><a href="#">运动户外</a></li>
<li><a href="#">汽车用品</a></li>
<li><a href="#">母婴</a></li>
<li><a href="#">食品</a></li>
<li><a href="#">营养</a></li>
</ul>
</body>
</html>
