CSS에서 특정 클래스 없이 마지막 요소를 선택하는 방법은 무엇입니까?

CSS에서 :last-child 및 :not(.class) 선택기 결합

CSS에서는 :last-child 선택기가 사용됩니다. 요소 목록에서 마지막 요소를 선택합니다. 그러나 이 선택기를 사용하여 특정 클래스 속성이 없는 마지막 하위 항목을 선택하는 것은 불가능합니다.

이를 달성하려면 다음 선택기를 사용해 볼 수 있습니다.

tr:not(.table_vert_controls):last-child

안타깝게도 :last-child는 목록의 마지막 요소를 구체적으로 대상으로 하고 이에 상응하는 :last-of-class 의사 클래스가 없기 때문에 이 선택기는 작동하지 않습니다.

2015년 말 현재 선택기 4 :nth-child() 및 :nth-last-child() 선택기에 대한 확장을 도입하여 더 복잡한 선택이 가능해졌습니다. 이 확장에는 임의의 선택기를 인수로 전달하는 기능이 포함되어 있습니다.

tr:nth-last-child(1 of :not(.table_vert_controls))

이 접근 방식은 더 장황하지만 원하는 요소를 선택하는 더 정확하고 효율적인 방법을 제공합니다. 그러나 Selectors 4에 대한 지원은 여전히 ​​제한적이라는 점에 유의하는 것이 중요합니다.

Selectors 4를 지원하지 않는 브라우저의 경우 대체 접근 방식은 JavaScript 선택기를 사용하는 것입니다.

$('tr:not(.table_vert_controls):last')

이 jQuery 선택기는 Selectors 4 선택기와 동일한 결과를 얻습니다. JavaScript를 사용하면 순수 CSS 솔루션에 비해 성능에 영향을 미칠 수 있다는 점은 주목할 가치가 있습니다.

위 내용은 CSS에서 특정 클래스 없이 마지막 요소를 선택하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!