CSS で水平スクロール バーを非表示にする方法: 最初に HTML に div を記述し、次に本文にスタイルを追加し、最後に非表示にするスタイル定義にステートメント「overflow-x: hidden;」を追加します。水平スクロールストリップ。
![CSSで水平スクロールバーを非表示にする方法](https://img.php.cn/upload/article/202104/19/2021041909403971255.jpg)
#この記事の動作環境: Windows 7 システム、Dell G3 コンピューター、HTML5&&CSS3 バージョン。
まず HTML に div を記述しますが、通常の状態ではスクロール バーはありません。
![1618796508300073.png CSSで水平スクロールバーを非表示にする方法](https://img.php.cn/upload/image/264/359/653/1618796508300073.png)
ページのコンテンツが非常に長い場合、または実際に大きな幅を設定した場合、スクロール バーが表示されます。
![1618796512466952.png CSSで水平スクロールバーを非表示にする方法](https://img.php.cn/upload/image/320/472/829/1618796512466952.png)
ページを実行すると、スクロール バーが表示されることがわかります。
![1618796516611201.png CSSで水平スクロールバーを非表示にする方法](https://img.php.cn/upload/image/589/482/750/1618796516611201.png)
このスクロール バーを非表示にするには、まず本文にスタイルを追加します。
![1618796521320885.png CSSで水平スクロールバーを非表示にする方法](https://img.php.cn/upload/image/892/647/489/1618796521320885.png)
スタイル定義に、スタイル
overflow-x: hidden;
を追加します。 [推奨される学習:
css ビデオ チュートリアル ]
![1618796528246458.png CSSで水平スクロールバーを非表示にする方法](https://img.php.cn/upload/image/187/150/887/1618796528246458.png)
ページを再度実行すると、ページのスクロール バーが消えていることがわかります。
![1618796532345039.png CSSで水平スクロールバーを非表示にする方法](https://img.php.cn/upload/image/393/300/303/1618796532345039.png)
このメソッドはスクロール バーを非表示にします。コンテンツが非常に長い場合、コンテンツの一部が非表示になります。慎重に検討する必要があるため、設定するのが最善です。最大幅。自動的に折り返されます。
![1618796536212510.png CSSで水平スクロールバーを非表示にする方法](https://img.php.cn/upload/image/791/186/270/1618796536212510.png)
以上がCSSで水平スクロールバーを非表示にする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。