채택완료

탭기능 active 활성시 이미지 변경에 대해 질문드립니다

2020-03-20 (금) 16:43:54 2,932

<ul class="tab" style="padding-top:0px"> 
              <li>

              <h2 class="tabtit1"><a class="active" href="#tab1"><img src="./out1.gif"/></h2></a></li>
              <li>

              <h2 class="tabtit2"><a href="#tab2"><img src="./out2.gif"/></a></h2>

              </li> 
</ul><!-- //Tab buttons -->

현재 이런식으로 탭제목이 되어 있는데 

active가 될경우 out1.gif가 in1.gif로 변경되도록 바꾸고 싶은데

어디다가 a:active { background-image:url(./in1.gif) }를 넣어야 될지 모르겠어요..

아시는 분 알려주시면 감사하겠습니다..

답변 3개 / 댓글 1개

채택된 답변
+20 포인트
2020-03-20 (금) 17:12:50

<style>

ul li .active img { background:url(./in1.gif); }

</style>

이런식으로 하시면됩니다.

활성화된 active 클래스 하위의 img 개체를 변경한다~ 라고 생각하시면됩니다.

답변에 대한 댓글 1개

ul li img 로 했을때 이미지로 나오는데 ul li .active img 하니깐 css에 아에 안잡혀요 ..

ul li.active a img 로 해보세요.  <li>태그의 active 유무로 결정 되어 지는 부분 같습니다.

2020-03-20 (금) 18:14:40

해당 사이트 URL 을 알려주세요. 봐드릴께요.

공개가 힘드시면 쪽지로 주셔도 됩니다.

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