どの要素でもスクロールできるようにしながら、スクロールバーを非表示にするにはどうすればよいでしょうか? まず、スクロール バーを非表示にして、コンテンツがオーバーフローしたときに表示する必要がある場合は、overflow: auto スタイルを設定するだけで済みます。スクロール バーを完全に非表示にしたい場合は、overflow: hidden を設定するだけですが、これにより要素のコンテンツはスクロールできなくなります。現時点では、要素がスクロールバーを非表示にしながらもコンテンツのスクロールを可能にする CSS ルールはありません。これは、特定のブラウザのスクロールバー スタイルを設定することによってのみ実現できます。 ファイアフォックス Firefox の場合、スクロールバーの幅を none に設定できます。 スクロールバーの幅: なし; /* Firefox */ インターネットエクスプローラー IE の場合、スクロールバーのスタイルを定義するには -ms-prefix 属性を使用する必要があります。 -ms-overflow-style: なし; /* IE 10+ */ Chrome および Safari ブラウザ Chrome および Safari ブラウザの場合、CSS スクロールバー セレクターを使用し、display:none を使用して非表示にする必要があります。 ::-webkit-スクロールバー{ display: none; /* Chrome Safari */ } 注: スクロール バーを非表示にする場合は、コンテンツがスクロール可能であることを確認するために、オーバーフロー表示を自動またはスクロールに設定するのが最適です。 例 上記の CSS プロパティとオーバーフローを使用して、水平スクロール バーを非表示にして垂直スクロール バーを許可する次の例を実装します。 .demo::-webkit-スクロールバー{ display: none; /* Chrome Safari */ } .デモ{ スクロールバーの幅: なし; /* firefox */ -ms-overflow-style: なし; /* IE 10+ */ オーバーフロー-x:非表示; オーバーフロー-y: 自動; } 要約する 上記は、CSS を使用して要素のスクロール バーを非表示にするサンプル コードです。お役に立てれば幸いです。ご質問がある場合は、メッセージを残していただければ、すぐに返信いたします。また、123WORDPRESS.COM ウェブサイトをサポートしてくださっている皆様にも感謝申し上げます。 |
<<: ウェブ画像形式としてPNG、JPG、GIFを選択して使用する方法
>>: IDEA2021 tomcat10 サーブレットの新しいバージョンの落とし穴
目次背景複合インデックスを理解する左端一致原則フィールド順序の影響複合インデックスは単一のインデック...
Linux で MySQL-5.7.19 バージョンをインストールするための最初のチュートリアル。す...
<br />原文: http://www.mikkolee.com/13私は最近、ver...
最近、私は「ぶどうコレクション」というプロジェクトに取り組んでいます。簡単に言うと、Budou ペー...
自己学習型ゲーム開発の道において、最も充実した瞬間は、自分でミニゲームを作り、友達と共有して試しにプ...
OP が現在のファームウェアで Web ページを開くと、常に 50% にズームアウトされてから表示さ...
1. 問題の症状バージョン: MySQL 5.6、従来の binlog ファイルと pos 方式を使...
px(ピクセル)ピクセルという言葉は皆さんもよくご存知だと思います。次に、この単位に関するちょっとし...
Java開発キットjdkをダウンロードするJDK のダウンロード アドレスはhttp://www.o...
まず、Windows 64 ビット用の最新の MySQL 5.7.17 コミュニティ圧縮バージョンを...
この記事では、カラフルな太陽のハロー効果を実現するためのJavaScriptキャンバスの具体的なコー...
その理由は、このタイプの Web ページが WAP と呼ばれるワイヤレス プロトコルから生成されたた...
この記事では、例を使用して、MySQL データベースの列を追加、削除、および変更する方法について説明...
負荷分散とは何ですか?ドメイン名が複数の Web サーバーを指している場合は、nginx ロード バ...
目標: 辺の長さが等しい正方形を作成する方法 1: 単位 vw を使用する (ps これが最も簡単な...