처리중입니다. 잠시만 기다려주세요.
TTJ 코딩클래스
정규반 단과 자료실 테크 뉴스 코딩 퀴즈
퀴즈 / CSS / 문제

CSS contain 속성의 목적은 무엇인가요?

어려움 MDN Web Docs
보기 및 정답
A 요소의 레이아웃, 스타일, 페인트 등을 독립적으로 격리하여 브라우저 렌더링 성능을 최적화한다
B overflow: auto와 overflow: scroll은 항상 동일하게 동작하는 속성이다
C float 속성이 적용된 요소는 display가 자동으로 inline으로 변경된다
D overflow: visible이 기본값이며 내용이 넘치면 자동 스크롤바가 생긴다

해설

contain: layout style paint 처럼 설정하면, 해당 요소의 렌더링이 다른 요소에 영향을 주지 않음을 브라우저에 알립니다. 브라우저는 해당 요소만 개별적으로 리렌더링할 수 있어 대규모 DOM에서 성능이 크게 향상됩니다.

코딩, 제대로 배우고 싶다면?

개념 확인은 퀴즈로, 실력은 실전 프로젝트로.
투더제이 코딩클래스에서 시작하세요.

정규반 살펴보기