2012-08-01 4 views
6

CSS 롤오버 메뉴에 문제가 있습니다.CSS의 호버리스트 만

많은 내용을 보았지만 자습서가 있지만 불필요한 코드가 너무 많아 필요한 코드와 다른 CSS를 구별하기가 어렵습니다.

내가 작업하고있는 웹 사이트에 의도적으로 스크립팅을 사용하지 않는 많은 사용자 (JavaScript)가 있기 때문에 CSS에 마우스를 가져 가야합니다.

사용자가 부모 목록 항목을 가리키면 부모 목록 항목 아래에 "하위 메뉴"가 표시되는 것을 이해할 수 없습니다. CSS로 어떻게 작동하는지 이해할 수 있습니까? 자신의 취향 (위치, 테두리, 색상에 대한 다음은 그 기본 형태로 작동합니다

enter image description here

답변

12

하지만 스타일 : 아래

는 내가 언급하고있는 무슨의 이미지입니다 등) :

다음 CSS와

<ul> 
    <li>Simple List item 
     <ul> 
      <li>sub menu item 1</li> 
      <li>sub menu item 2</li> 
      <li>sub menu item 3</li> 
     </ul> 
    </li> 
</ul> 

JS Fiddle demo.

+0

감사합니다. 그것은 실제로 보여 지거나 숨겨 졌을 때 숨 깁니다. 그러나 내가 설정 한 상단 또는 좌측 또는 설정 한 위치에 관계없이 "하위"메뉴 항목은 페이지의 맨 위 왼쪽에만 나타납니다. (실제 메뉴는 페이지 오른쪽에 있고 조금 아래에 있습니다.) - – Arrow

+0

나는 물건을 보았습니까? 아니면 답안의 일부 코드가 사라졌습니까? – Arrow

+0

@ MiljanPuzović 고맙고 David Thomas에게 감사드립니다 - 내가 기대했던대로 작동합니다. 마침내 그것이 어떻게 끝 났는지 이해하게되어 기쁘다! :-) – Arrow