Question 1

CSS 브레이크포인트란 무엇인가요?

Accepted Answer

CSS 브레이크포인트는 웹사이트 레이아웃이 화면 크기에 맞게 변경되는 특정 뷰포트 너비입니다. @media (min-width: 768px)와 같은 CSS 미디어 쿼리로 정의합니다.

Question 2

Tailwind CSS의 브레이크포인트는 무엇인가요?

Accepted Answer

Tailwind CSS는 sm(640px), md(768px), lg(1024px), xl(1280px), 2xl(1536px) 6개의 기본 브레이크포인트를 가집니다.

Question 3

Bootstrap의 브레이크포인트는 무엇인가요?

Accepted Answer

Bootstrap 5는 xs(576px 미만), sm(576px 이상), md(768px 이상), lg(992px 이상), xl(1200px 이상), xxl(1400px 이상) 6개의 브레이크포인트를 정의합니다.

Question 4

모바일 퍼스트 접근법이란 무엇인가요?

Accepted Answer

모바일 퍼스트 디자인은 작은 화면을 위한 기본 스타일을 먼저 작성하고, min-width 미디어 쿼리로 큰 화면 스타일을 적용하는 방식입니다.

Question 5

커스텀 브레이크포인트를 정의할 수 있나요?

Accepted Answer

네. Tailwind에서는 tailwind.config.js에서 브레이크포인트를 확장할 수 있습니다. 이 도구에서도 커스텀 브레이크포인트를 직접 추가하여 비교할 수 있습니다.

브레이크포인트 시각화

자주 묻는 질문