又大又长粗又爽又黄少妇视频,亚洲区综合区小说区激情区

                        課程
                    
                        /前端開發(fā)
                        
                            /JavaScript
                        
                        /商城分類導航效果

<!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=gb2312" />
<title>京東導航制作練習</title>
   <style type="text/css"> /* 樣式表*/
    body /*(全局的body的定義-通用字體大小)*/

   {

       padding:0; /*填充為0*/
       font-size:10pt;/*字體大小*/
   }
   .topmenu   /*給分類加一個邊框,設置樣式*/
   {
       display:block;/*設置元素為塊級元素顯示*/
       width:220px;/*設置寬度*/
       border:2px solid #e4393c;/*設置邊框線型尺寸、類型、顏色（需要十六制值）*/
       margin:0;/*邊界（上、右、下、左）順序不能混*/
       padding:0;/*內(nèi)容填充（上、右、下、左）順序不能混*/
   }
   .toptitle
   {
        height:40px;/*高度*/
       line-height: 40px;/*與垂直居中*/
       text-align:left;/*文字左對齊*/
       font-family:"微軟雅黑";
       font-size:11pt;字號
       font-weight:bold;/*字體加粗*/
       color:white;/*顏色*/
       background:#e4393c;
       padding-left:25px;/*填充*/
   }
   .topmenu li /*針對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(images/1.png);/*定義背景圖片*/
       background-repeat:no-repeat;/*背景不重復*/
       background-position:right;/*默認是在左邊，設置背景在右邊*/
   }
   .topmenu li a /*去掉a標簽下的下劃線及顏色*/
   {
         text-decoration:none;
       color:#313131;
   }
   .topmenu li a:hover   /*li下面的a標簽所有的超級鏈接在鼠標移動下的狀態(tài) hover被大部分標簽支持*/
   {
       text-decoration:underline;/*鼠標經(jīng)過產(chǎn)生下劃線*/
       font-weight:bold;/*字體加粗*/
       color:#e4393c;
   }
   .topmenu li:hover /*給每個li標簽修改樣式*/
   {
         border:1px solid #DDD; /*邊框線為1px,實線顏色為灰色*/
       border-right:0px;/*右邊無邊框*/
       box-shadow:0 0 8px #DDD; /*邊框背景陰影，外發(fā)光效果*/
       -moz-box-shadow:0 0 8px #DDD; /*兼容火狐瀏覽器 -邊框背景陰影，外發(fā)光效果*/
       -webkit-box-shadow:0 0 8px #DDD; /*兼容谷歌瀏覽器 -邊框背景陰影，外發(fā)光效果*/
       background-image:none;/*設置不顯示背景圖片*/
   }
   .submenu
   {
         display:none;/*block為顯示，none為隱藏*/
       width:715px;
       left:220px;
       position:absolute;
       top:40x;
       border:1px solid #DDD;
       z-index:4;
       background-color:white;
       box-shadow:0 0 8px #DDD; /*邊框背景陰影，外發(fā)光效果*/
       -moz-box-shadow:0 0 8px #DDD; /*兼容火狐瀏覽器 -邊框背景陰影，外發(fā)光效果*/
       -webkit-box-shadow:0 0 8px #DDD; /*兼容谷歌瀏覽器 -邊框背景陰影，外發(fā)光效果*/
   }
   .leftdiv
   {
         background:pink;
       float:left;
       width:400px;
       margin:5px;
   }
   .rightdiv
   {
         background:green;
       float:left;
       width:200px;
       margin:5px;
   }
    .topmenu li:hover .submenu /*問題在這里：這里定義樣式后，鼠標經(jīng)過不顯示，是什么原因？求解，謝謝*/
   {
         display:block;

   }
   </style>
</head>

<body>
    <ul class="topmenu">
       <div class="toptitle">
        全部商品分類
       </div>
        <li><a href="#">圖書、音像、數(shù)字商品</a></li>
            <div class="submenu">
               <div class="leftdiv">
                     左側(cè)二級分類<br/>
                   左側(cè)二級分類<br/>
                   左側(cè)二級分類<br/>
                   左側(cè)二級分類<br/>
                   左側(cè)二級分類<br/>
                   左側(cè)二級分類<br/>
               </div>
               <div class="rightdiv">
                     右側(cè)推薦內(nèi)容<br/>
               </div>
            </div>
       <li><a href="#">家用電器</a></li>
       <li><a href="#">手機、數(shù)碼、京東通信</a></li>
       <li><a href="#">電腦、辦公</a></li>
       <li><a href="#">家居、家具、家裝、廚具</a></li>
       <li><a href="#">服飾內(nèi)衣、珠寶首飾</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="#">營養(yǎng)保健</a></li>
       <li><a href="#">彩票、旅行、充值、票務</a></li>
    </ul>
</body>
</html>