24장. 점진 향상과 `@supports`

CSS는 모르는 선언을 무시하는 forward-compatible parsing을 가진다. 먼저 읽히고 조작되는 기본 화면을 만든 뒤 지원 기능을 추가한다.

.popover { position: fixed; inset: auto 1rem 1rem auto; }
@supports (anchor-name: --trigger) {
  .popover { position-anchor: --trigger; }
}

지원 query가 true라고 모든 edge case가 완벽한 것은 아니다. 프로젝트 browser matrix에서 최소 한 번 시각·상호작용 회귀를 실행한다. polyfill의 크기·보안·유지보수 비용도 기능 가치와 비교한다.