안정화 및 베타 버전으로 공개된 몇 가지 흥미로운 기능을 살펴보세요. 웹브라우저에서 지원됩니다
안정적인 브라우저 버전
2024년 2월 Firefox 123 및 Chrome 122가 안정화되었습니다. 이 게시물에서는 웹 플랫폼에 추가된 새로운 기능을 살펴봅니다.
선언적 Shadow DOM
Firefox 123은 <template>의 shadowrootmode 속성을 지원합니다.
요소가 지원되므로
선언적 Shadow DOM.
이제 이 기능은 새로 제공되는 기준과 교차 운용이 가능하므로 기준선을 조인합니다.
모든 주요 브라우저에 적용됩니다.
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에 있습니다.
베타 브라우저 출시
베타 브라우저 버전을 통해 다운로드할 수 있습니다. 지금은 새로운 기능을 테스트하거나 앱이 전 세계에 출시되기 전에 사이트에 영향을 미칠 수 있습니다. 새 상품 베타는 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 속성
이 속성은 요소가 콘텐츠를 렌더링하는지 여부를 제어합니다.
필요할 때까지 콘텐츠 렌더링을 생략할 수 있습니다.