인프런 커뮤니티 질문&답변
작성한 질문수
질문이있습니다 css 부분이용
작성
·
207
1
input[id=tab1]:checked ~ .slide1 {
display: block;
}
input[id=tab2]:checked ~ .slide2 {
display: block;
}
input[id=tab3]:checked ~ .slide3 {
display: block;
<div class="content slide1">
<img src="/images/slide-01.jpg">
</div>
<div class="content slide2">
<img src="/images/slide-02.jpg">
</div>
<div class="content slide3">
<img src="/images/slide-03.jpg">
</div>
여기에서 질문이있는데요 input[id=tab3]:checked ~ 여기까지는
이해가 되는데 .slide3 부분이 이해가 되지않네요
무슨 말이냐하면
.다음에는 클래스이름 content slide1이 되어야 하지않나요?
input[id=tab3]:checked ~ .content slide1 이런식으로요.
답변 1
0
코딩웍스(Coding Works)
지식공유자
<div class="content slide3"></div>
클래스 네임이 이렇게 되어 있다는 말은 .content이면서 .slide3이라는 뜻입니다.
그래서 .content.slide3 또는 .slide3 이렇게 하셔야 해요.
.content .slide3라고 하시면 .content 밑에 .slide3이 있다는 뜻이에요.
아래 html처럼 인식되서 작동하지 않습니다.
<div class="content">
<div class="slide"></div>
</div>
감사합니다. 이해가 됬습니다