Tràn ra

Sử dụng các tiện ích viết tắt này để nhanh chóng định cấu hình cách nội dung tràn phần tử.

Điều chỉnh thuộc overflowtính một cách nhanh chóng với bốn giá trị và lớp mặc định. Các lớp này không đáp ứng theo mặc định.

Đây là một ví dụ về việc sử dụng .overflow-autotrên một phần tử có kích thước chiều rộng và chiều cao đã đặt. Theo thiết kế, nội dung này sẽ cuộn theo chiều dọc.

Đây là một ví dụ về việc sử dụng .overflow-hiddentrên một phần tử có kích thước chiều rộng và chiều cao đã đặt.

Đây là một ví dụ về việc sử dụng .overflow-visibletrên một phần tử có kích thước chiều rộng và chiều cao đã đặt.

Đây là một ví dụ về việc sử dụng .overflow-scrolltrên một phần tử có kích thước chiều rộng và chiều cao đã đặt.

<div class="overflow-auto">...</div>
<div class="overflow-hidden">...</div>
<div class="overflow-visible">...</div>
<div class="overflow-scroll">...</div>

Sử dụng các biến Sass, bạn có thể tùy chỉnh các tiện ích tràn bằng cách thay đổi $overflowsbiến trong _variables.scss.

Sass

API tiện ích

Tiện ích bổ sung được khai báo trong API tiện ích của chúng tôi trong scss/_utilities.scss. Tìm hiểu cách sử dụng API tiện ích.

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