이것은이 질문과 유사합니다. CSS는 두 명의 자식 이지만 더 일반적인 경우에만 첫 번째 자식을 선택 합니다. 두 자녀가있는 경우 두 자녀를 모두 선택하는 구체적인 작업이 있습니다.
나는 이것을 생각 해냈다.
li:nth-child(1):nth-last-child(2), li:nth-child(2):nth-last-child(1)
작동하지만 단일 선택기로 만들 수 있는지 궁금합니다. 그렇다면 패턴으로 일반화 할 수 있으며 3 개의 요소 만있는 경우 3 개의 하위 요소와 같은 수의 요소와 함께 작동하도록 할 수 있고, 4 개의 하위 요소 만있는 경우 4 개의 하위 요소를 모두 사용할 수 있습니다.
이것은 삭제 버튼이 있지만 최소한 N 개의 항목이 필요하고 최소 항목 수가있을 때 버튼을 숨기려는 경우에 유용합니다.
당신이 할 수있는 최선은 :
.box > *:nth-last-child(3):first-child,
.box > *:nth-last-child(3):first-child ~ * {
color: red;
}
/*
.box > *:nth-last-child(N):first-child,
.box > *:nth-last-child(N):first-child ~ * {
color: red;
}
*/<div class="box">
<span>text</span>
</div>
<div class="box">
<span>text</span>
<span>text</span>
</div>
<div class="box">
<span>text</span>
<span>text</span>
<span>text</span>
</div>
<div class="box">
<span>text</span>
<span>text</span>
<span>text</span>
<span>text</span>
</div>이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다