3
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

::webkit-scrollbar プロパティ一覧

Posted at

何気に Edge が Chromium になって、出来ないのはあと Firefox だけなんですね

::-webkit-scrollbar

スクロールバー全体
角のやつ (scrollbar-corner) は含まれないっぽい

image.png

::-webkit-scrollbar-button

端にある上下左右のボタン

image.png

::-webkit-scrollbar-thumb

スクロールバー

image.png

::-webkit-scrollbar-track

スクロールバーが表示されてるとこ、トラック
スクロールバー全体 (scrollbar) からボタン (scrollbar-button) を除いた範囲

image.png

::-webkit-scrollbar-track-piece

現在のスクロール位置までで分割されてるトラック (?)

image.png

::-webkit-scrollbar-corner

縦横のスクロールバーの交差するとこ

image.png

::-webkit-resizer

textarea とかで、リサイズできる時に右下に表示されるやつ
範囲は交差するとこの (scrollbar-corner) と同じ

image.png

分かりやすいような分かりにくいようなサンプル

See the Pen scrollbar on CodePen.

3
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?