모든 브라우저에서 CSS의 마지막 하위 요소 스타일을 안정적으로 지정하려면 어떻게 해야 합니까?

:last-child 선택기 이해

스타일 지정 웹 페이지의 맥락에서 :last-child 선택기를 사용하면 스타일을 적용할 수 있습니다. 특히 주어진 컨텍스트의 마지막 요소에 적용됩니다. 그러나 특정 상황에서는 사용법이 어려울 수 있습니다.

최종

내의 요소 컨테이너. 다음 CSS 규칙 구현:

#refundReasonMenu #nav li:last-child {
    border-bottom: 1px solid #b5b5b5;
}

마지막

• 요소의 경우 그렇게 하지 못할 수 있습니다. 이는 :last-child와의 브라우저 간 호환성이 불안정할 수 있기 때문입니다. 특히 Internet Explorer 9 이하 버전과 Safari 버전 3.2 이하에서는 이 의사 클래스에 대한 지원이 부족합니다.

  브라우저 비호환성 해결

  브라우저 간 일관성을 보장하려면 다음을 사용하는 것이 좋습니다. 대신 마지막 자식에 대한 명시적 클래스:

  #refundReasonMenu #nav li.last-child {
      border-bottom: 1px solid #b5b5b5;
  }

  "last-child" 클래스 추가 HTML 요소에:

  <li class="last-child"><a href="#">...</a></li>

  마지막

• #nav 컨테이너 내의 요소입니다.

  위 내용은 모든 브라우저에서 CSS의 마지막 하위 요소 스타일을 안정적으로 지정하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!