반응형

화면의 크기에 반응하여 위치, 크기, 레이아웃 및 스타일 등이 다르게 표시되도록 합니다.

[주의 사항]

특정 디바이스 모드에서 스타일을 변경한 경우 해당 디바이스 보다 작거나 같은 경우에만 적용됩니다.

예를 들면 태블릿 모드에서 스타일을 변경하면 데스크탑 모드에는 적용되지 않습니다.

[디바이스별 크기 기준점]

• 데스크탑 ( 992px ~ )

992 보다 크거나 같은 경우

• 태블릿 ( 768px ~ 991px )

768 보다 크거나 같고 991보다 작거나 같은 경우

• 모바일 가로 ( 576px ~ 767px )

576 보다 크거나 같고 767 보다 작거나 같은 경우

• 모바일 ( ~ 575px )

576 보다 작은 경우

스타일 규칙을 적용할 상태를 나타냅니다.

• 일반

기본 상태 입니다.

• 오버

요소 위체 마우스 포인터가 있는 경우

• 활성

요소가 활성화 되어 있는 경우

예를 들면 슬라이더 컴포넌트의 경우 사용자 인터렉션에 따라서 좌우로 슬라이드 되면서 특정 요소가 보여집니다.

특정 요소가 보여질 때 대상 요소가 활성화 상태가 됩니다.

• 상위 오버

상위 요소 위체 마우스 포인터가 있는 경우

• 상위 활성

상위 요소가 활성화 되어 있는 경우

• 스크롤 되었을 때

스크롤 위치가 이동된 경우

• 스크롤 위치가 하단 근처일 때

스크롤 위치가 화면 영역의 하단 근처에 있는 경우