상단 메뉴 막대가 있으며 각 메뉴 항목 위로 마우스를 가져 가면 자주색으로 바뀝니다.커서가 하위 메뉴로 이동했을 때 CSS 상단 메뉴가 마우스 커서가 움직이지 않을 때
이러한 메뉴 중 하나에는 추가 항목 드롭 다운 목록도 있습니다. 이 하위 메뉴를 통해 마우스 커서를 아래로 움직이면 최상위 메뉴가 원래 스타일로 돌아갑니다. 하위 메뉴 항목 위에 마우스를 올려 놓더라도 보라색을 유지하고 싶습니다. 웹 사이트가 here 인 경우, "정보"아래의 하위 메뉴 위로 마우스를 이동하면 문제가 표시됩니다.
나는 비슷한 몇 가지 stackoverflow 답변을 통해 검색했습니다. 예를 들어,이 문제는 previous answer here입니다. 나는
#topnav li hover:a {}
이
#topnav li a:hover {}
에서 변화를 시도하지만이 제안 된 변경 또는 원래 어느 쪽 상단 메뉴 보라색 유지합니다. 아래의 전체 코드 :
#topnav {
clear: both;
background: url(nav-bg-orange.png) no-repeat;
height: 87px;
width: 962px;
padding: 6px 63px 6px;
}
#topnav ul {
list-style: none;
float: left;
}
#topnav ul li {
list-style: none;
float: left;
padding: 3px 0 0 0;
border-left: 1px dashed #f38739;
}
#topnav ul li:last-child {
border-right: 1px dashed #f38739;
}
#topnav ul li a {
float: left;
display: block;
color: #fff;
font-size: 14px;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
padding: 15px 20px 15px 20px;
border: 0;
outline: 0;
line-height: 1;
list-style-type: none;
text-transform: uppercase;
}
#topnav li#active a,
#topnav li:hover a {
color: #fff;
background: #745b7c;
display:block;
border-radius: 5px 5px 0 0;
}
/****************************** flyout menus ******************************/
#wsite-menus .wsite-menu li a {
font-family: Tahoma, Geneva, sans-serif;
padding: 11px;
color: #fff;
background: #745b7c;
border: 0;
border-bottom: 1px dashed #9e89a4;
}
#wsite-menus .wsite-menu li:hover a {
color: #fff;
background: #8c7395;
}
당신도 html을 공유 할 수 있습니까 ..? – Awesomestvi
'#topnav ul : hover'을 시도해 보셨습니까? – simeg
어떤 jsfiddle을 사용할 수 있습니까? –