hover之后懸浮部分不出來(lái)。真不知道錯(cuò)哪里
<!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>無(wú)標(biāo)題文檔</title>
<link rel="stylesheet" href="css/css練習(xí).css" type="text/css" />
//引入代碼如下
@charset "utf-8";
/* CSS Document */
*{ margin:0px; padding:0px;}
.nav_item{ width:220px; border:2px solid #e4393c; margin:10px; position:relative;}/*ul大盒子導(dǎo)航*/
.nav_item .bt_item{ height:40px; line-height:40px; font-size:15px; font-family:"微軟雅黑"; padding:0px 20px; background-color:#e4393c;}/*ul下面的標(biāo)題部分*/
.nav_item .bt_item a{ color:#FFF; text-decoration:none;}
.nav_item li{ height:30px; line-height:30px; text-align:left; padding-left:8px; font-size:14px;list-style-type:none; background:url(../images/ybxtb1.png) no-repeat right;}/*公共部分的li*/
.nav_item li a{ color:#000; text-decoration:none; }/*公共部分的a標(biāo)簽*/
/*.nav_item span{ display:inline-block; width:10px; height:30px; background-color:#F00;}*/
.nav_item li:hover{ border:1px solid #DDD;-webkit-box-shadow:0 0 8px #DDD;}
.nav_item li:hover .suspension{ display:block;}
/*懸浮部分制作*/
.bt_item .suspension{ width:1000px; border:1px solid #DDD; position:absolute; left:220px; -webkit-box-shadow:0 0 8px #DDD; z-index:5; background-color:#FFF; display:none;}/*懸浮大盒子*/
.bt_item .suspension1_left{ float:left; width:780px; ?margin:5px;}/*第一個(gè)懸浮大盒子的左邊*/
.bt_item .suspension1_right{ float:left; width:200px; background-color:red; margin:5px;}/*第一個(gè)懸浮大盒子的右邊*/
</head>
<body>
<ul class="nav_item">
? ? <h1 class="bt_item">
? ? ? ? <a href="#">全部商品分類</a>
? ? ? ? ? ? <div class="suspension">
? ? ? ? ? ? <div class="suspension1_left">
? ? ? ? ? ? ? ? 左邊的部分001<br />
? ? ? ? ? ? ? ? ? ? 左邊的部分001<br />
? ? ? ? ? ? ? ? ? ? 左邊的部分001<br />
? ? ? ? ? ? ? ? ? ? 左邊的部分001<br />
? ? ? ? ? ? ? ? ? ? 左邊的部分001<br />
? ? ? ? ? ? ? ? ? ? 左邊的部分001<br />
? ? ? ? ? ? ? ? </div>
? ? ? ? ? ? ? ? <div class="suspension1_right">
? ? ? ? ? ? ? ? 右邊的部分<br />
? ? ? ? ? ? ? ? ? ? 右邊的部分<br />
? ? ? ? ? ? ? ? ? ? 右邊的部分<br />
? ? ? ? ? ? ? ? ? ? 右邊的部分<br />
? ? ? ? ? ? ? ? ? ? 右邊的部分<br />
? ? ? ? ? ? ? ? </div>
? ? ? ? ? ? </div>
? ? ? ? </h1>
? ? <li class="dh_item1">
? ? ? ? <a href="#">家用電器</a>
? ? ? ? </li>
? ? ? ? <li class="dh_item2">
? ? ? ? <a href="#">手機(jī)、</a><a href="#">數(shù)碼、</a><a href="#">京東通信</a>
? ? ? ? </li>
? ? ? ? <li class="dh_item3">
? ? ? ? <a href="#">電腦、</a><a href="#">辦公</a>
? ? ? ? </li>
? ? ? ? <li class="dh_item4">
? ? ? ? <a href="#">家居、</a><a href="#">家具、</a><a href="#">家裝、</a><a href="#">廚具</a>
? ? ? ? </li>
? ? ? ? <li class="dh_item5">
? ? ? ? <a href="#">男裝、</a><a href="#">女裝、</a><a href="#">內(nèi)衣、</a><a href="#">珠寶</a>
? ? ? ? </li>
? ? ? ? <li class="dh_item6">
? ? ? ? <a href="#">個(gè)人化妝</a><a href="#">清潔用品</a>
? ? ? ? </li>
? ? ? ? <li class="dh_item7">
? ? ? ? <a href="#">鞋靴、</a><a href="#">箱包、</a><a href="#">鐘表、</a><a href="#">奢侈品</a>
? ? ? ? </li>
? ? ? ? <li class="dh_item8">
? ? ? ? <a href="#">運(yùn)動(dòng)戶外</a>
? ? ? ? </li>
? ? ? ? <li class="dh_item9">
? ? ? ? <a href="#">汽車(chē)</a><a href="#">汽車(chē)用品</a>
? ? ? ? </li>
? ? ? ? <li class="dh_item10">
? ? ? ? <a href="#">母嬰</a><a href="#">玩具樂(lè)器</a>
? ? ? ? </li>
? ? ? ? <li class="dh_item11">
? ? ? ? <a href="#">食品、</a><a href="#">酒類、</a><a href="#">生鮮、</a><a href="#">特產(chǎn)</a>
? ? ? ? </li>
? ? ? ? <li class="dh_item12">
? ? ? ? <a href="#">營(yíng)養(yǎng)保健</a>
? ? ? ? </li>
? ? ? ? <li class="dh_item13">
? ? ? ? <a href="#">圖書(shū)、</a><a href="#">音像、</a><a href="#">電子書(shū)</a>
? ? ? ? </li>
? ? ? ? <li class="dh_item14">
? ? ? ? <a href="#">彩票、</a><a href="#">旅行、</a><a href="#"></a><a href="#">充值、</a><a href="#">票務(wù)</a>
? ? ? ? </li>
? ? ? ? <li class="dh_item15">
? ? ? ? <a href="#">理財(cái)、</a><a href="#">眾籌、</a><a href="#">白條、</a><a href="#">保險(xiǎn)</a>
? ? ? ? </li>
? ? </ul>
</body>
</html>
2016-02-27
編輯器截圖