帮忙看下哪里错了？-慕课网

帮忙看下哪里错了？

来源：3-2 编程练习

GoHr

2015-08-08 16:00

<!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>
</head>
<style type="text/css">
body{ padding:0; margin:0}
.bigmenu{ border:#c81623 solid 2px; width:220px; display:block; margin:0; padding:0; text-height:30px;}
.toptitle{ background-color:#b1191a; text-align:left; text-indent:10px; height:48px; line-height:40px; color:#fff;}
.bigmenu li a{ color:#000; text-decoration:none;}
.bigmenu li{ text-indent:10px; height:20px; background-image:url(5411027300014f0200220030.jpg.png); background-repeat:no-repeat; background-position:right; text-height:0px; font-size:14px; display:block; padding-top:8px; padding-bottom:4px; z-index:3;}
.hidmenu{ display:none; position:absolute; z-index:4; width:715px; left:220px; top:49px; background-color:#FFF; border:1px solid #ddd; border-right:0; box-shadow:0 0}
.bigmenu li:hover .hidmenu{ display:block;}
.bigmenu li:hover a{ text-decoration:underline; font-weight:bold; color:#F00}
.bigmenu li:hover{ border:1px solid #ddd; border-right:0; box-shadow:0 0}
.right{ float:left; width:490px; margin:5px;}
.left{ float:left; width:200px; margin:5px;}
</style>
<script type="text/javascript">
        window.onload = function () {
      // 编写JS代码
      var lis=document.getElementsByTagName("li")
      for(i=0;i<lis.length;i++)
      {
          lis[i].onmouseover=function()
          {
              this.className="lihover"
          }
      }
      for(i=0;i<lis.length;i++)
      {
          lis[i].onmouseout=function()
          {
              this.className=""
          }
      }
        }
    </script>
<body>
<ul class="bigmenu">
        <div class="toptitle">全部商品分类</div>
        <li><a href="#">图书、音像、数字商品</a>
            <div class="hidmenu">
                <div class="right"><br/>信息<br/>信息<br/>信息<br/>信息<br/>信息<br/></div>
                <div class="left"><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>

写回答关注

2回答

学之舟_36820: 2015-09-02 17:29:00

.bigmenu li:hover .hidmenu{ display:block;}
.bigmenu li:hover a{ text-decoration:underline; font-weight:bold; color:#F00}
.bigmenu li:hover{ border:1px solid #ddd; border-right:0; box-shadow:0 0}

将19、20、21这三行的li:hover替换成.lihover

.bigmenu .lihover .hidmenu{ display:block;}
.bigmenu .lihover a{ text-decoration:underline; font-weight:bold; color:#F00}
.bigmenu .lihover{ border:1px solid #ddd; border-right:0; box-shadow:0 0}

0 0

GoHr

2015-08-08 16:01:49

JavaScript语言去掉 lihover换成li:hover就可以实现哪里错了呢

0 0

商城分类导航效果

两种方法实现分类导航，同时扩展讲解其它商城分类导航的制作方法

63738 学习 · 276 问题

查看课程

相似问题

有没有哪位大神帮我看看哪里有错，检查了好久

回答 1

求大神帮忙解答下。

回答 3

求大神帮忙看下代码？实现不出来二级菜单移出

回答 2

哪位大神帮我看一下这些提示是什么意思？

回答 1

哪里出错了，没有系哦啊过，css就有

回答 1

打开慕课网App查看更多内容