마우스를 가져 가면 중첩 목록의 색상을 변경할 수 있습니까?

Question

나는 CSS 전용 네비게이션을 만들었고, 마우스를 가져 가면 중첩 된 목록의 텍스트 색상을 변경할 수 있는지를 알아 내려고합니다.

 <div id="navigation"> 
    <ul class="top-level"> 
     <li><a href="#">Home</a></li> 
     <li><a href="#">Residential</a> 
      <ul class="sub-level"> 
       <li><a href="#">Project 1</a></li> 
       <li><a href="#">Project 2</a></li> 
       <li><a href="#">Project 3</a></li> 
       <li><a href="#">Project 4</a></li> 
      </ul> 

그래서 '주거', '프로젝트 1-4'에 마우스를 올려 놓았을 때 그대로 나타나고 나는 텍스트 '거주'가 아닌 다른 색상과 배경 있도록 처리했다. 그러나, 내가하고 싶은 것은 이제 'Project 1-4'의 텍스트 색상을 바꿔 놓았습니다. CSS에서 가능합니까?

Answer 1

이렇게하려면 CSS Pseudo-classes을 사용할 수 있습니다.

.elementclass:hover은 호버에서 요소의 스타일을 지정하는 데 사용할 수 있습니다.

Answer 2

나는 그것을 알아 냈다. ... 나는 벌써 이것을 시험해 보았다. 그러나 어쩌면 어떤 이유인지 그것은 아마도 업데이트하지 않았다. 명백하게 아래의 클래스의 아래에서 나는 백색을 더할 필요가 있었다, 그리고, 나는 또한 아래의 진행하고있는 학급이 또한 검정 (그것이했던 검은)을 가지고 있는지 확인 할 필요가 있었다. BlasterAlfred 나는 당신에게 몇가지 신용을 주어야한다.

#navigation a:hover{ 
text-decoration: none; 
color: white; 
} 

#navigation li li a { 
color: black; 
}