내용으로 건너뛰기 문서 내비게이션으로 건너뛰기
// Overflow

콘텐츠가 요소를 오버플로우 하는 방식을 빠르게 구현 하려면 이러한 단축 유틸리티를 사용하세요.

네 가지 기본값과 클래스를 사용하여 즉시 overflow 속성을 조절합니다. 이러한 클래스는 기본적으로 반응형이 아닙니다.

This is an example of using .overflow-auto on an element with set width and height dimensions. By design, this content will vertically scroll.
This is an example of using .overflow-hidden on an element with set width and height dimensions.
This is an example of using .overflow-visible on an element with set width and height dimensions.
This is an example of using .overflow-scroll on an element with set width and height dimensions.
<div class="overflow-auto">...</div>
<div class="overflow-hidden">...</div>
<div class="overflow-visible">...</div>
<div class="overflow-scroll">...</div>

Sass 변수를 사용하여 _variables.scss에서 $overflows 변수를 변경하여 overflow 유틸리티를 사용자 정의할 수 있습니다.

Sass

유틸리티 API

Overflow 유틸리티는 scss/_utilities.scss의 유틸리티 API에 선언되어 있습니다. Learn how to use the utilities API.

    "overflow": (
      property: overflow,
      values: auto hidden visible scroll,
    ),