1
当您将鼠标悬停在第一个链接(产品,技术等)上时,会出现一个下拉菜单,链接将变为橙色。当您将鼠标悬停在下拉菜单上时,它仍然保持橙色。我记得为此做了一些事情,现在我想摆脱它,但我不能为了我的生活记住我是如何做到这一点的,并且无法撤消它。任何人都可以看到我如何解决这个问题
这里的CSS:
#navbar{
list-style: none;
float: right;
margin-top: 54px;
position: relative;
}
.firstnavmenu{
margin-top: 10px;
}
/*first level*/
#navbar li{
float:left;
width: 140px;
text-align: center;
-webkit-transition: background 0.3s ease;
-moz-transition: background 0.3s ease;
-o-transition: background 0.3s ease;
transition: background 0.3s ease;
}
#navbar li a{
text-decoration: none;
font-family: "Open Sans", sans-serif;
font-size: 11px;
letter-spacing: 1px;
color: #524F4F;
font-weight: 600;
-webkit-transition: color 0.3s ease;
-moz-transition: color 0.3s ease;
-o-transition: color 0.3s ease;
transition: color 0.3s ease;
}
#navbar li:hover > a{
color: #f3a82e;
}
#navbar li:hover > ul{
height: 250px;
}
/* second level */
#navbar li ul{
list-style: none;
position: absolute;
top: 100%;
height:0px;
overflow: hidden;
-o-transition: all .3s ease-in;
-webkit-transition: all .3s ease-in;
-moz-transition: all .3s ease-in;
transition: all .3s ease-in;
}
#navbar li ul li:last-child{
padding-bottom: 10px;
border-bottom-right-radius: 8px;
border-bottom-left-radius: 8px;
-webkit-border-bottom-right-radius: 8px;
-webkit-border-bottom-left-radius: 8px;
-moz-border-bottom-right-radius: 8px;
-moz-border-bottom-left-radius: 8px;
}
#navbar li ul li{
float: none;
position: relative;
width: 140px;
height: auto;
background-color:rgba(255,255,255,0.7);
color:rgba(255,255,255,0.7);
padding-top:5px;
padding-bottom: 5px;
}
#navbar li ul li a{
padding-left: 10px;
text-align: left;
padding-top: 6px;
width: 90%;
height: 100%;
display: block;
}
谢谢!这个伎俩。 –