哪位大神幫我看看，鼠標(biāo)懸浮在li上時，怎么隱藏的塊不顯示，而且鼠標(biāo)懸浮在li上時，會出現(xiàn)閃動的情況，怎么解決
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標(biāo)題文檔</title>
<style>
body {
padding:0px;
font-size:10pt;
}
.topmenu {
display:block;
width:220px;
border:1px solid #b1191a;
margin:0;
padding:0;
}
.toptitle {
height:40px;
line-height:40px;
text-align:left;
font-size:11pt;
font-weight:bold;
color:#FFF;
background-color:#b1191a;
padding-left:20px;
}
.topmenu li {
height:30px;
line-height:30px;
font-size:11pt;
list-style:none;
text-align:left;
padding-left:20px;
background-color:#c81623;
z-index:1;
}
.topmenu li a {
text-decoration:none;
color:#FFF;
}
.topmenu li a:hover{
color:#F00;
font-weight:bold;
}
.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-color:#FFF;
}
.submenu {
display:none;
width:1000px;
position:absolute;
top:40px;
left:220px;
border:1px solid #ddd;
z-index:2;
background-color:#036;
box-shadow:0 0 8px #ddd;
-moz-box-shadow:0 0 8px #ddd;
-webkit-box-shadow:0 0 8px #ddd;
}
.left {
float:left;
width:810px;
margin:5px;
background-color:#96C;
}
.right {
float:right;
width:175px;
margin:5px;
background-color:#33C;
}
.topmenu li:hover submenu {
display:block;
}
</style>
</head>
<body>
? <ul class="topmenu">
? ? <div class="toptitle">
? ? ? 全部商品分類
? ? </div>
? ? ?<li><a href="#">圖書、音像、數(shù)字商品</a>
? ? ? ? ?<div class="submenu">?
? ? ? ? ? ? ?<div class="left">
? ? ? ? ? ? ? 左側(cè)懸浮欄<br />
? ? ? ? ? ? ? 左側(cè)懸浮欄<br/>
? ? ? ? ? ? ? 左側(cè)懸浮欄<br/>
? ? ? ? ? ? ? 左側(cè)懸浮欄<br/>
? ? ? ? ? ? ?</div>
? ? ? ? ? ? ?<div class="right">
? ? ? ? ? ? ?右側(cè)懸浮欄
? ? ? ? ? ? ?</div>
? ? ? ? ?</div>
? ? ?</li>
? ? ?<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="#">個護(hù)化妝</a></li>
? ? ?<li><a href="#">鞋靴、箱包、鐘表、奢侈品</a></li>
? ? ?<li><a href="#">運(yùn)動戶外</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>
2015-11-28
由于你所命名的“submenu”是一個類名，所以你的css選擇器應(yīng)該在submenu前加“.”
.topmenu li:hover .submenu {
display:block;
}
菜鳥拙見，僅供參考
2015-11-28
好了，但原因是什么呢？不加block就閃
2015-11-28
在你的代碼對應(yīng)位置加上我給你圈出的代碼，你試試
2015-11-28
不敢當(dāng)，客氣了
2015-11-28
當(dāng)submenu的width:1005px的效果圖
2015-11-28
left：width:810+margin:10px(5px*2){左右兩個外邊距}=820px
right:width:175px+margin:10px(5px*2){左右兩個外邊距}=185px
.submenu:width:1000px < 820px+185px（1005px）
左右兩個塊元素（left+right）的寬度之和比他們的父級塊元素(submenu)的寬度多出5px，所以第二個元素（right）就被擠到下邊了，你把.submenu的width值改大試一下。
2015-11-28
你的類名沖突了
2015-11-28
應(yīng)該是li 和a 的 hover事件沖突了，去改改看