css 클래스명 + 클래스명에서 질문

css 클래스명 + 클래스명에서 질문

QA

css 클래스명 + 클래스명에서 질문

본문

css 에서 클래스명 + 클래스명 {margin-top:10px} 에서
예를들어서 여러개가 있다면 처음부분은 안먹히던데 원래 그런건가요? 
<div class="hello">안녕하세요</div>
<div class="hello">안녕하세요</div>
<div class="hello">안녕하세요</div>
<div class="hello">안녕하세요</div>
<div class="hello">안녕하세요</div>
<div class="hello">안녕하세요</div>

.hello + .hello {margin-top:10px}
 

이 질문에 댓글 쓰기 :

답변 5

클래스명 + 클래스명으로 선택자를 선택하면 지정한 클래스를 제외한 바로 다음에 오는 형제요소를 선택하게됩니다.
따라서 첫번째 .hello클래스를 찾고 바로 다음에오는 2번째 .hello부터 적용이 되는것입니다.
 

CSS에서 .hello + .hello {margin-top:10px}직후 형제 선택자를 사용하여 첫 번째 .hello 요소 바로 뒤에 오는 .hello 요소에만 margin-top: 10px 속성을 적용합니다.

따라서 예시 코드에서 첫 번째 .hello 요소에는 margin-top 속성이 적용되지 않지만, 두 번째부터 마지막까지 모든 .hello 요소에는 10px의 여백이 위쪽에 추가됩니다.

답변을 작성하시기 전에 로그인 해주세요.
전체 1

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT