#滚动区域

#用途

@import "tailwindcss";
@import "@a3s-lab/ui/a3s.css";

@import "tailwindcss";
@import "@a3s-lab/ui/base.css";
@import "@a3s-lab/ui/styles/a3s.css";

<div class="scrollbar h-72 overflow-y-auto rounded-md border p-4">
  Your scrollable content here.
</div>

在已使用 overflow-auto、overflow-y-auto 或 overflow-x-auto 滚动的元素上使用 scrollbar 或 scrollbar-sm。

组件类增强了原生滚动的跨浏览器样式。它不封装内容、取代浏览器滚动行为或需要 JavaScript。

#示例

这些示例使用卡片作为框架表面，因此源自半径活动样式包。

#卧式

将 scrollbar 与 overflow-x-auto 结合使用以实现水平滚动。

#薄型

将 scrollbar-sm 用于紧凑的可滚动区域，例如菜单、列表框、侧边栏和命令结果。

#RTL

在可滚动元素或其祖先之一上设置 dir="rtl" 以使用从右到左布局。