真的找不出原因了,大家?guī)蛶兔?。謝謝。為什么鼠標(biāo)移到了LI上那個(gè)懸浮層沒顯示出來呢?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<style>
*{margin: 0;
padding: 0}
.top{height: 40px;
line-height: 40px;
font-size: 11pt;
color:white;
padding-left: 20px;
text-align: left;
font-weight: bold;
background: #e4393c;}
.iul{border: 2px solid #e4393c;
width: 220px;
margin-left:30px;
margin-top: 20px }
.iul li{list-style-type: none;
padding-left:8px;
height: 30px;
line-height: 30px;
text-align: left;
z-index: 3;
/* background-image:url(1.png); */
background-image:url(http://img1.sycdn.imooc.com//5411027300014f0200220030.jpg);
background-repeat: no-repeat;
background-position:right; }
.iul li a{text-decoration: none;
font-size: 11pt;
color:gray;}
.iul li a:hover{color:#e4393c;
text-decoration:underline;
font-weight:bold;}
.iul li:hover{background-image: none;
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;}
.okc{display:none;
z-index: 4;
width: 715px;
left: 240px;
position:absolute;
top:60px;
border:1px solid #DDD;
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;
width: 490px;
float: left;
margin: 5px;}
.rightdiv{background: blue;
width: 200px;
float: left;
margin: 5px;}
.iul li:hover .okc{display:block;}
</style>
<body>
<ul class='iul'>
<div class='top'>全部商品分類</div>
<li><a href='#'>圖書、音像、數(shù)字產(chǎn)品</a></li>
<div class='okc'>
<div class='leftdiv'>手機(jī)<br>電腦<br>通訊<br>筆記本</div>
<div class='rightdiv'>右側(cè)推薦品牌<br>右側(cè)推薦品牌<br>右側(cè)推薦品牌</div>
</div>
<li><a href='#'>家用電器</a></li>
<li><a href='#'>手機(jī)、數(shù)碼、京東通信</a></li>
<li><a href='#'>電腦、辦公</a></li>
<li><a href='#'>家居、家具、家裝、</a></li>
<li><a href='#'>服飾內(nèi)衣、珠寶首飾</a></li>
<li><a href='#'>個(gè)護(hù)化妝</a></li>
<li><a href='#'>鞋靴、挎包、鐘表、奢飾品</a></li>
<li><a href='#'>移動(dòng)戶外</a></li>
<li><a href='#'>汽車用品</a></li>
<li><a href='#'>母嬰、玩具、樂器</a></li>
<li><a href='#'>商品飲料、酒類、生鮮</a></li>
<li><a href='#'>營養(yǎng)保健</a></li>
<li><a href='#'>彩票、旅行、充值、票務(wù)</a></li>
</ul>
</body>
</html>
2018-10-11
<div class='okc'>
<div class='leftdiv'>手機(jī)<br>電腦<br>通訊<br>筆記本</div>
<div class='rightdiv'>右側(cè)推薦品牌<br>右側(cè)推薦品牌<br>右側(cè)推薦品牌</div>
</div>
這段代碼要放到li標(biāo)簽里面,你放在外面了