具体的なコードは次のとおりです。 /*スクロールバーの幅*/ ::-webkit-スクロールバー{ 幅:9px; 高さ:9px; } /* 外側のトラック。 display:none を使用して非表示にしたり、背景画像を追加してディスプレイの色を変更したりできます*/ ::-webkit-スクロールバートラック{ 幅: 6px; 背景色:#0d1b20; -webkit-border-radius: 2em; -moz-border-radius: 2em; 境界線の半径:2em; } /*スクロールバーの設定*/ ::-webkit-スクロールバー-サムネイル { 背景色:#606d71; 背景クリップ:パディングボックス; 最小高さ:28px; -webkit-border-radius: 2em; -moz-border-radius: 2em; 境界線の半径:2em; } /*スクロールバーが移動する背景*/ ::-webkit-スクロールバー-サムネイル:ホバー{ 背景色:#fff; } CS ::-webkit-スクロールバー { } ::-webkit-スクロールバーボタン { } ::-webkit-スクロールバートラック { } ::-webkit-スクロールバー-トラックピース { } ::-webkit-スクロールバー-サムネイル { } ::-webkit-スクロールバーコーナー { } ::-webkit-リサイザー { } 上記の CSS コードによって制御される領域の関係は次のとおりです。 ::-webkit-scrollbar スクロールバー全体。その属性には、幅、高さ、背景、境界線 (ブロックレベル要素と同様) などが含まれます。 CSS3 を使用してスクロール バーの美化効果を実現するサンプル コードに関するこの記事はこれで終わりです。CSS3 スクロール バーの美化に関する関連コンテンツについては、123WORDPRESS.COM の以前の記事を検索するか、次の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。 |
<<: HTMLフローティングプロンプトボックス機能の実装コード
この記事では、ローカルストレージの追加、削除、変更を実装するためのVueの具体的なコードを例として紹...
リソースファイルのプロトコルを省略する画像、メディアファイル、スタイル、スクリプトの URL では、...
####システム内の入出力の管理#### 1. システムの入力と出力のリダイレクトを理解する入力リダ...
基礎トランザクションは、SQL ステートメントのグループに対するアトミック操作です。つまり、グループ...
1. 全体的なアーキテクチャ図他のデータベースと比較すると、MySQL は、そのアーキテクチャがさま...
目次事前準備展開ターゲットDocker環境構築クラウドサーバーに接続Docker環境をインストールす...
目次1. 関数デバウンス1. 画像安定化とは何ですか? 2. 関数のスロットリング2.1 タイマーの...
ページに複数の画像を導入すると、画像のサイズがばらつくことがあります。しかし、それらを一貫したサイズ...
目次DockerにRedisをインストールする1. Redisイメージを見つける2. Redisイメ...
Explain コマンドは、データベースのパフォーマンス問題を解決するために最初に推奨されるコマンド...
コードをコピーコードは次のとおりです。 .sugLayerDiv{位置:相対; overflow:h...
最近、WeChat アプレットを作成しているのですが、いくつか問題が発生しました。インターネットでい...
テーブルを切り捨てる個々の行の削除をログに記録せずに、テーブル内のすべての行を削除します。文法 テー...
概要: 仕事でも面接でも、Web フロントエンドのパフォーマンスを最適化することは非常に重要です。で...
この記事では主に、クーポンの背景画像などでよく使われる CSS 円形ホローイングについて紹介し、皆さ...