# Safari 17.2의 새로운 WebKit 기능들

> Clean Markdown view of GeekNews topic #12343. Use the original source for factual precision when an external source URL is present.

## Metadata

- GeekNews HTML: [https://news.hada.io/topic?id=12343](https://news.hada.io/topic?id=12343)
- GeekNews Markdown: [https://news.hada.io/topic/12343.md](https://news.hada.io/topic/12343.md)
- Type: news
- Author: [xguru](https://news.hada.io/@xguru)
- Published: 2023-12-15T09:41:18+09:00
- Updated: 2023-12-15T09:41:18+09:00
- Original source: [webkit.org](https://webkit.org/blog/14787/webkit-features-in-safari-17-2/)
- Points: 7
- Comments: 0

## Topic Body

### HTML   
- Exclusive Accordion: &lt;details&gt; 엘리먼트에 name 속성 지원. 하나 선택시 다른 아이템 자동으로 닫음   
- &lt;input&gt; 필드에 autocomplete="one-time-code" 넣어서 문자로 수신한 OTP코드 자동입력 지원   
### CSS   
- CSS Nesting 할때 엘리멘트 셀렉터에 & 붙여야 하는 제한 사라짐   
- rcap, rex, ric, rch 등의 Root 유닛 지원   
- CSS Motion Path를 웹 표준을 더 준수하도록 업데이트   
- 애니메이션과 트랜지션에 linear() 함수 지원 추가   
- rem(), mod(), round() 등의 수학함수 지원   
- counter-set 속성 지원   
- -webkit-mask-box-image 에서 브라우저 프리픽스를 제거하고 mask-border-[mode|outset|repeat|slice|source|width] 직접 지원   
- Custom Highlights API 지원: ::selection 같은 것을 ::highlight() 함수로 커스텀 지정 가능   
### Image 와 Video   
- Responsive Image를 Preloading 지원 : &lt;link rel=preload&gt;의 imagesrcset/imagesizes 를 &lt;img&gt;의 srcset/sizes 처럼 그대로 이용 가능   
- imageOrientation 속성의 이미지 값 그대로 사용하는 것을 none 에서 from-image로 더 적절하게 변경   
- SVG의 &lt;image crossorigin&gt; 지원   
- H264 L1T2 코덱 지원   
- webkitPreservesPitch 에서 브라우저 프리픽스 제거하고 HTMLMediaElement.preservesPitch 로 추가   
### JavaScript   
- import attributes 지원 (임포트 할때 타입 정보 추가 가능)  
- Intl.NumberFormat 의 FormatApproximately 지원   
### Web API   
- Fetch Priority 지원: 이미지, 스크립트, CSS 등에 대해서 fetchpriority=[high|low|auto] 등 설정 가능   
- Form Validation 시에 title 속성 지원. 검증 에러시에 title 값을 보여줌   
- CanvasRenderingContext2D.prototype.reset() 지원   
- 특정 마우스 이벤트를 disabled된 폼 컨트롤에 보내기 지원 : mouseenter, mouseleave, mousemove, mouseover, mousewheel 등. click/mouseup/mousedown 은 받지 못함   
### Web Apps   
- Login Cookies: 웹앱을 맥의 "Add to Dock" iOS의 "Add to HomeScreen" 했을때도 Login Cookie를 저장해서 로그인 유지 가능   
- 웹앱 아이콘이 깔끔하게 보이도록 변경. 최고의 경험을 위해서는 SVG 나 1024x1024 이상의 이미지를 제공 필요   
- 맥의 웹앱에서 "상태 표시줄 보기 활성화" 가능. 웹앱 창에서 처음으로 로딩할 페이지를 쉽게 변경 가능   
### WebGL   
- 새로운 WebGL 확장 지원: EXT_blend_func_extended, WEBGL_clip_cull_distance  
### Privacy   
- blob partitioning 추가   
### Web Inspector   
- 컬러 팔레트에서 Color Variable 지원  
- 애니메이션 타이밍 조정해서 보기

## Comments



_No public comments on this page._
