Bramus
아담 아가일
CSS 중첩 문법 선택을 돕기 위한 이전 설문조사를 실행한 후 CSS Working Group은 CSS의 중첩을 정의하는 가장 좋은 방법을 찾기 위한 논쟁을 계속했습니다. 토론 중에 새로운 구문 아이디어가 제안되었습니다. 실무 그룹에서 이러한 구문 중 하나를 선택하는 데 도움이 되도록 새로운 설문조사를 진행하고자 합니다.
옵션
이전 설문조사의 결과에 따르면 옵션 1과 2는 더 이상 고려되지 않습니다. 두 가지 새로운 옵션 (4개 및 5개)이 추가되었습니다.
옵션 5: 최상위 중첩 컨테이너
선언과 중첩된 여러 스타일 규칙이 있는 & { … } 블록을 포함하는 최상위 @nest 규칙이 도입되었습니다.
@nest selector {
& {
property: value;
}
nested-selector {
property: value;
}
}
옵션 4: Postfix 제안서
중첩 규칙을 포함하는 추가 코드 블록이 선언을 포함하는 기본 규칙 뒤에 삽입됩니다.
selector {
property: value;
} {
nested-selector {
property: value;
}
}
옵션 3: 글자가 아닌 시작 제안
모든 중첩된 규칙은 기호 없이 시작해야 하므로 그 자체로 명확해야 합니다. 유형 선택기로 선택기를 시작해야 한다면 & div나 :is(div)를 작성하면 됩니다.
selector {
property: value;
& nested-selector {
property: value;
}
}
위의 스니펫은 각 제안서의 기본사항을 설명하기 위해서만 사용되었지만, 새로운 설문조사와 함께 더 많은 예시가 포함되어 있습니다.
투표하기
투표하려면 https://webkit.org/blog/13607/ 페이지를 방문하세요. 투표하려면 등록이 필요하지 않습니다. '옵션 5', '옵션 4' 또는 '옵션 3'을 선택하고 제출을 누르세요.