테스트 사이트 - 개발 중인 베타 버전입니다

CSS HOVER 관련 질문드려요~ 채택완료

그누초보님 9년 전 조회 5,929

a:hover 를 이용하여

드롭다운 메뉴를 구상중인데요

 

</p><p><style></p><p>.menu_over { display: block; }
.sub_over { display: none; z-index:1; }
.menu_over:hover .ad_sub_over { display: block; }</p><p>#txt1 { color:#ffffff; font-size:30px; }</p><p></style></p><p> </p><p><div class="menu_over"></p><p><span id="txt1">메뉴A</span></p><p><div class="sub_over"></p><p><span id="txt1">하위메뉴A</span></p><p></div></p><p></div></p><p>

 

menu_over 란 이름의 개체에 마우스 오버시

sub_over 가 보이게 되는건데

 

혹시 오버시에 다른 이름의 스타일을 변경할수 없나요?

 

위 소스대로 적용하고 main_over 개체를 마우스 오버시에

text1 이라는 span 객체의 폰트색상을 다른색으로 변경하고 싶습니다.

JS 를 사용하지 않고 단순 CSS 로만 가능할까요?

 

 

 


 

댓글을 작성하려면 로그인이 필요합니다.

답변 1개

채택된 답변
+20 포인트
9년 전

이미 질문소스에 답이 있네요

:hover 붙이면 됩니다.

#txt는 main_over 내부에 있으니 그대로 선언해주면 되겠습니다.

.main_over:hover #txt1 {color:#aaaaaa;}

이런식입니다.

다만, id는 한페이지에 하나만 존재해야 합니다. 위와 같은 경우에는 클래스를 사용하시는게 맞습니다.

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

그누초보님
9년 전
아.. 클래스로 해결하면 되는군요. 감사합니다^^

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인