2월에 웹 플랫폼을 새로 도입

안정화 및 베타 버전으로 공개된 몇 가지 흥미로운 기능을 살펴보세요. 웹브라우저에서 지원됩니다

2024년 2월 Firefox 123Chrome 122가 안정화되었습니다. 이 게시물에서는 웹 플랫폼에 추가된 새로운 기능을 살펴봅니다.

Firefox 123은 <template>shadowrootmode 속성을 지원합니다. 요소가 지원되므로 선언적 Shadow DOM. 이제 이 기능은 새로 제공되는 기준과 교차 운용이 가능하므로 기준선을 조인합니다. 모든 주요 브라우저에 적용됩니다.

브라우저 지원

  • 111
  • 111
  • 123
  • 16.4

소스

103 초기 힌트: 미리 로드

Firefox 123에는 103가지 초기 힌트 상태 코드를 정의합니다.

브라우저 지원

  • 103
  • 103
  • 123
  • x

CSS ::backdrop 상속 변경사항

::backdrop CSS 의사 요소는 표시 영역 크기의 상자로, 최상위 레이어에 표시되는 모든 요소 바로 아래에 렌더링됩니다. ::backdrop의 원래 사양에서 상속되지 않은 것으로 지정되었습니다. 상속되지 않습니다. ::backdrop이(가) 실행한 작업 :root에 선언된 맞춤 속성에 액세스할 수 없습니다.

::backdrop가 속성을 상속할 수 있도록 사양이 변경되었습니다. 추출해야 합니다. 이 변경사항은 Chrome 122에서 구현됩니다.

자세히 알아보기: ::backdrop 변경사항을 적용합니다.

저장소 버킷 API

Chrome 122에는 Storage Buckets API가 포함되어 있습니다. 이 API를 사용하면 사이트에서 기기 내 데이터를 버킷으로 구성하고 그러면 다른 버킷에 보관된 데이터와 독립적으로 그룹 데이터를 제거할 수 있습니다.

자세히 알아보기: Storage Buckets API 문서

브라우저 지원

  • 122
  • 122
  • x
  • x

Async Clipboard API: 정리되지 않은 HTML 읽기

Chrome 122 베타에는unsanitizedread() Async Clipboard API 사용하여 정리되지 않은 HTML 형식을 검색할 수 있습니다.

JavaScript Set 메서드

Chrome 122에서는 다음 Set 메서드를 구현합니다.

이러한 방법은 버전 17부터 Safari에 이미 구현되어 있습니다. Firefox Nightly에 있습니다.

브라우저 지원

  • 122
  • 122
  • 127
  • 17

소스

베타 브라우저 출시

베타 브라우저 버전을 통해 다운로드할 수 있습니다. 지금은 새로운 기능을 테스트하거나 앱이 전 세계에 출시되기 전에 사이트에 영향을 미칠 수 있습니다. 새 상품 베타는 Firefox 124 이달에 출시된 Chrome 123 Safari 17.4 진행 중입니다. 이러한 릴리스는 플랫폼에 많은 훌륭한 기능을 제공합니다. 출시 확인하기 메모를 남겨두세요. 몇 가지 주요 사항은 다음과 같습니다.

Chrome 123에는 몇 가지 새로운 CSS 기능이 포함되어 있습니다. light-dark() 색상 함수 을 사용하면 사용자 환경설정에 맞게 색 구성표를 쉽게 조정할 수 있습니다. field-sizing 속성은 자동으로 증가하는 텍스트 입력란을 사용 설정합니다. 새로운 미디어가 있음 기능을 사용하여 PIP 모드로 표시되는 앱을 테스트할 수 있습니다.

text-spacing-trim 속성은 중국어, 일본어, 및 한국어 (CJK) 구두점 문자를 사용하면 공백을 과도하게 조정할 수 있습니다. 자세히 알아보기: CSS를 위한 네 가지 새로운 국제 기능 소개

Chrome 123 및 Safari 17.4 베타에서 align-content가 지원됩니다. 사용할 수 있습니다. 자세히 알아보기 align-content로 변경 도움이 될 수 있습니다 그리드 외부에서 속성을 사용할 수 있는 경우 사이트 테스트 또는 플렉스 레이아웃과 같은 플렉스 레이아웃을 사용해야 합니다. 함수와 일치해야 합니다.

Firefox 124는 CSS content-visibility 속성 이 속성은 요소가 콘텐츠를 렌더링하는지 여부를 제어합니다. 필요할 때까지 콘텐츠 렌더링을 생략할 수 있습니다.