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

源自：4-1 细节优化及扩展（一）

为什么在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 15:11

个回答

老司机tony: 2016-12-15 22:52:38

因为你把 .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://img.mukewang.com/5411027300014f0200220030.jpg);
            background-repeat: no-repeat;
            background-position: right;
        }