안정화 및 베타 버전으로 공개된 몇 가지 흥미로운 기능을 살펴보세요. 웹브라우저에서 지원됩니다
안정적인 브라우저 버전
2023년 12월 Firefox 121, Chrome 120 및 Safari 17.2가 안정화되었습니다. 이 게시물에서는 웹 플랫폼에 미치는 영향을 살펴봅니다.
CSS 중첩을 위한 완화된 파싱
Chrome 120 및 Safari 17.2에는 CSS 중첩을 위한 완화된 파싱. 이는 Firefox 버전 117부터 지원되었으므로 모든 주요 엔진에서 이 구문 변경을 지원합니다.
<details>
요소가 포함된 전용 아코디언
Chrome 120 및 Safari 17.2는name
<details>
요소 즉, YouTube 오디오 전용 '아코디언' 구성요소를
여러 <details>
요소를 그룹화하여
전용 아코디언에서 자세히 알아보세요.
브라우저 지원
- 120
- 120
- x
- 17.2
:has()
선택기
Firefox 121에는 CSS :has()
선택기가 포함되어 있습니다. 이 버전에서는 :has()
이 모든 주요 엔진에서 상호 운용될 수 있습니다.
:has()
: 가족 선택기에서 자세히 알아보세요.
CSS Custom Highlight API
Safari 17.2에는
CSS Custom Highlight API
텍스트 범위를 만들고 스타일을 지정할 수 있습니다.
::selection
와 같은 표준 강조 표시 의사 클래스를 확장합니다.
CloseWatcher API
Chrome 120에는 닫기 요청을 수신 대기하고 이에 응답하는 새 API인 CloseWatcher API가 포함되어 있습니다.
이러한 요청은 데스크톱에서는 ESC
키, Android에서는 뒤로 동작 또는 버튼으로 트리거됩니다.
제대로 구현하기가 까다로울 수 있습니다.
API 외에도 Chrome 120은 Android 뒤로 버튼에 응답하도록 <dialog>
및 popover
속성을 업그레이드합니다.
브라우저 지원
- 126
- 126
- x
- x
CSS text-wrap: balance
및 stable
Firefox 121에는 text-wrap
에 대한 balance
및 stable
값이 포함되어 있습니다.
balance
값은
텍스트를 더 보기 좋고 읽기 쉽게 만듭니다. stable
값은 수정 가능한 콘텐츠를 수정하는 동안 다시 저장하지 않도록 합니다.
text-wrap: balance
를 자세히 알아보세요.
<iframe>
요소의 지연 로드
Firefox 121은 <iframe>
요소에서 loading
속성을 지원합니다.
즉, iframe의 지연 로드가 이제 모든 주요 엔진에서 지원됩니다.
브라우저 지원
- 77
- 79
- 121
- 16.4
linear()
이징 함수 지원
Safari 17.2에는 이징 함수도 지원하는 linear()
이징 함수가 포함되어 있어
바운스 및 스프링 효과.
브라우저 지원
- 113
- 113
- 112
- 17.2
베타 브라우저 출시
베타 브라우저 버전을 통해 다운로드할 수 있습니다. 지금은 새로운 기능을 테스트하거나 앱이 전 세계에 출시되기 전에 사이트에 영향을 미칠 수 있습니다. 새 상품 베타는 Firefox 122 Chrome 121 및 Safari 17.3 이러한 릴리스는 플랫폼에 많은 훌륭한 기능을 제공합니다. 출시 확인하기 메모를 남겨두세요. 몇 가지 주요 사항은 다음과 같습니다.
Firefox 122 및 Chrome 121에는 HTMLSelectElement의 showPicker()
메서드가 포함되어 있습니다.
이렇게 하면 요소가 선택되었을 때 표시되는 것과 동일한 선택 도구가
버튼 누르기 또는 기타 사용자 상호작용으로 트리거될 수 있습니다.
Chrome 121에는 스크롤바 스타일 지정 속성 scrollbar-color
및 scrollbar-width
가 포함되어 있습니다.
SVG의 향상된 CSS 마스킹과 함께
맞춤법이 잘못되었거나 문법적으로 잘못된 텍스트의 유사 요소를 강조 표시합니다.