scrollbar-width

scrollbar-width

Utilities for controlling the width of an element's scrollbar.

Class Styles

scrollbar-auto

scrollbar-width: auto;

scrollbar-thin

scrollbar-width: thin;

scrollbar-none

scrollbar-width: none;

示例

使用 scrollbar-auto 工具类来使用浏览器的默认滚动条宽度：

<div class="scrollbar-auto overflow-auto ...">  <!-- ... --></div>

使用 scrollbar-thin 工具类来使用更细的滚动条：

垂直滚动

塞留蓝档案馆占据了旧天文台上方三层狭窄的楼层，每层都排列着装有星图、探险笔记和黄铜仪器的抽屉，这些都由人工编目。

在冬日清晨，工作人员会在书架间推着梯子穿行，淡淡的光线透过屋顶窗户洒下，落在阅览桌上。

访客可以申请馆藏中的任何资料，但大多数人来这里是为了那些描绘海岸线的地图集，而这些海岸线已不再出现在现代地图上。

每一本归还的卷册都会先经过检查、除尘和包裹，然后再被送回书库，等待下一位研究者。

<div class="scrollbar-thin overflow-auto ...">  <!-- ... --></div>

使用 scrollbar-none 工具类来隐藏滚动条，同时仍然允许元素滚动：

<div class="scrollbar-none overflow-auto ...">  <!-- ... --></div>

这些工具类仅支持浏览器关键字 auto、thin 和 none。

Prefix a scrollbar-width utility with a breakpoint variant like md: to only apply the utility at medium screen sizes and above:

<div class="scrollbar-none md:scrollbar-auto ...">  <!-- ... --></div>

Learn more about using variants in the variants documentation.