Html 如何阻止悬停时此父元素受到影响?
当您将鼠标悬停在第一个链接(产品、技术等)上时,会出现一个下拉菜单,该链接将变为橙色。当您将鼠标悬停在下拉菜单上时,它将继续保持橙色。我记得我做了一些事情让它这样做,我现在想摆脱它,但我一辈子都记不起我是怎么做的,也无法撤销它。有人知道我该怎么撤销吗 以下是css:Html 如何阻止悬停时此父元素受到影响?,html,css,Html,Css,当您将鼠标悬停在第一个链接(产品、技术等)上时,会出现一个下拉菜单,该链接将变为橙色。当您将鼠标悬停在下拉菜单上时,它将继续保持橙色。我记得我做了一些事情让它这样做,我现在想摆脱它,但我一辈子都记不起我是怎么做的,也无法撤销它。有人知道我该怎么撤销吗 以下是css: #navbar{ list-style: none; float: right; margin-top: 54px; position: relative; } .firstnavmenu{
#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;
}
比使用
#navbar li a:hover{
color: #f3a82e;
}
而不是这个
#navbar li:hover > a{
color: #f3a82e;
}