                        课程
                    
                        /前端开发
                        
                            /JavaScript
                        
                        /商城分类导航效果

为什么在lihover里增加height后，去掉前面的.topmenu, 鼠标放上去高度不发生变化?

如果去掉前面的.topmenu，边框和阴影效果都有，但是height的高度完全不发生变化？

原因是什么？

.topmenu .lihover {

border: 1px solid #DDD;

box-shadow: 0 0 8px #DDD; height:60px; line-height:60px;

}

rainy_li3676598

2016-12-14

源自：商城分类导航效果 4-1

关注问题我要回答

1070

操作

收起

1 回答

老司机tony
2016-12-15

因为你把 .topmenu 去掉之后它的权重不够，设置的样式没有覆盖之前设置的样式；

代码如下（31行-43行）：

.topmenu 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(http://img1.sycdn.imooc.com//5411027300014f0200220030.jpg);
            background-repeat: no-repeat;
            background-position: right;
        }