| 属性名 | scrollbar-width |
|---|---|
| 値 | auto | thin | none |
| 初期値 | auto |
| 適用可能要素 | スクロールコンテナ |
| 継承 | 継承しない |
| サポート | https://caniuse.com/mdn-css_properties_scrollbar-width |
スクロールバーの幅を指定します。IE を除く大半のブラウザでサポートされています。
.my-box {
width: 10rem;
height: 5rem;
border: 1px solid #999;
overflow: scroll;
scrollbar-width: #99f #fcc;
}
.scrollbar-width-auto { scrollbar-width: auto; }
.scrollbar-width-thin { scrollbar-width: thin; }
.scrollbar-width-none { scrollbar-width: none; }
<pre class="my-box scrollbar-width-auto">...</pre> <pre class="my-box scrollbar-width-thin">...</pre> <pre class="my-box scrollbar-width-none">...</pre>
AAA BBB CCC DDD EEE FFF GGG
AAA BBB CCC DDD EEE FFF GGG
AAA BBB CCC DDD EEE FFF GGG