이제 2023년 마지막 분기가 접어들고 있으며, 모든 브라우저에서 Interop 2023 중점 분야에 대해 많은 진전을 보이고 있습니다. 이 문서에서는 지금까지의 상호 운용성 2023 점수와 올해의 노력으로 인해 현재 사용할 수 있는 기능을 알아봅니다.
2023년 1월 상태
2023년 1월, Google은 Interop 2023의 출시와 모든 엔진에서 개선해야 할 26가지 중점 영역을 발표했습니다.
출시 당시 실험용 브라우저의 전체 Interop 점수는 62점이었습니다.
2023년 10월 기준 상태
실험용 브라우저의 전체 Interop 점수는 89입니다. 안정화 버전 뷰로 전환하고 안정화된 브라우저에 이미 제공된 항목을 살펴보면 점수가 75점입니다. 그 이면에는 현재 주요 엔진에서 작동하는 많은 것들이 있습니다. 이 중 일부는 소규모 상호 운용성 수정사항일 뿐 아니라 주요 기능입니다.
컨테이너 쿼리 및 컨테이너 쿼리 길이 값 크기 조절
지난 2월, 컨테이너 쿼리 크기 상호 운용이 가능하게 된 것을 기념했습니다. 이 기능은 웹 개발자들이 오랫동안 기다려왔던 기능이었으며, 모든 엔진에서 이 기능을 빠르게 사용할 수 있게 된 것은 웹 플랫폼에 큰 도움이 되었습니다.
크기 컨테이너 쿼리와 함께 컨테이너 쿼리 단위가 도입되었습니다.
이는 vw와 같은 표시 영역 단위와 같은 방식으로 사용되며, 표시 영역이 아닌 컨테이너와 관련이 있다는 점이 다릅니다.
브라우저 지원
- 105
- 105
- 110
- 16
색상 공간 및 함수
5월에 색상 공간 실험실, LCH, Oklab, Oklch는 상호 운용 가능한 방식으로 지원됩니다. CSS 기능 표기법 lab(), lch(), oklab() 및 oklch()는 개발자가 이러한 색상 공간을 사용하는 방법을 제공합니다. 함수 표기법 color() 및 color-mix()도 포함되었습니다.
이러한 새로운 색상 공간 및 함수에 관한 자세한 내용은 고화질 CSS 색상 가이드를 참고하세요.
서브 그리드
CSS 그리드 레이아웃의 서브 그리드 기능은 중첩된 그리드가 상위 그리드의 트랙 정의를 사용할 수 있도록 하는 grid-template-columns 및 grid-template-rows의 새로운 값입니다. 즉, 그리드 구조에 중첩된 항목을 정렬할 수 있습니다.
서브그리드에 대해 자세히 알아보기 서브그리드 구현을 어렵게 만든 몇 가지 복잡성을 알아보려면 BlinkOn 18의 동영상을 시청하세요.
HTML inert 속성
HTML inert 전역 속성을 사용하면 페이지의 섹션을 비활성으로 신고할 수 있습니다. 이렇게 하면 클릭 및 포커스 이벤트가 방지되고 요소와 그 콘텐츠가 접근성 트리에서 숨겨집니다. 이 기능은 시각적으로 화면 밖에 있어서 스크린 리더에서도 비활성화되어야 하는 콘텐츠에 유용합니다.
그 외에도 다양한 기능이 있습니다.
올해 브라우저에 이러한 주요 기능 외에도 다양한 기능과 수정사항이 포함되어 있습니다. 올해 남은 기간 동안 브라우저 출시가 예정되어 있으며 점수가 모두 나오면 전체 요약을 게시하겠습니다.