87

接頭辞が二重コロンである疑似要素は初めてです。一部のWebkitのみのcssを使用したスクロールバーのスタイリングについて説明しているブログ記事に出くわしました。疑似要素CSSを個々の要素に適用できますか?

/* This works by applying style to all scroll bars in window */
::-webkit-scrollbar {
    width: 12px;
}

/* This does not apply the scrollbar to anything */
div ::-webkit-scrollbar {
    width: 12px;
}

このフィドルでは、divのスクロールバーをカスタマイズしたいのですが、メインウィンドウのスクロールバーはデフォルトのままです。

http://jsfiddle.net/mrtsherman/4xMUB/1/

4

4 に答える 4

113

あなたの考えは正しかった。ただし、div ::-webkit-scrollbar後にスペースを入れた表記は、実際には;divと同じです。div *::-webkit-scrollbarこのセレクターは、「内部の任意の要素のスクロールバー」を意味し<div>ます。を使用しdiv::-webkit-scrollbarます。

http://jsfiddle.net/4xMUB/2/でデモを参照してください。

于 2011-10-12T17:22:04.857 に答える
38

カスタム スクロールバーを使用するためにクラス セレクターを使用したいと考えています。

どういうわけか.foo::-webkitうまくいきませんが、うまくいくことがわかりましたdiv.foo::-webkit!それらの ##$$*## 疑似物....

http://jsfiddle.net/QcqBM/16/を参照してください

于 2012-05-22T06:09:06.553 に答える