CSS Div要素で水平スクロールバーのみを表示するにはどうすればよいですか?

CSS Div 要素のみで水平スクロール バーを表示する方法

Div コンテナは、HTML の表示要素によく使用されます。コンテンツが div の定義された幅と高さを超えたときに水平スクロール バーと垂直スクロール バーの両方を自動的に表示するには、オーバーフロー プロパティを auto に設定できます。

問題:

div コンテナのスタイルが overflow: auto で定義されている場合、コンテンツが水平方向にのみオーバーフローしている場合でも、水平スクロール バーと垂直スクロール バーの両方が自動的に表示されます。目標は、テーブルの高さをプログラムで制御しながら、水平スクロール バーのみを表示することです。

解決策:

この問題を解決する鍵は、提案されている CSS3 を利用することにあります。拡張機能により、スクロールバーを独立して制御できるようになります。これを実現する方法は次のとおりです:

overflow: auto;
overflow-y: hidden;

この CSS コードは、水平スクロールバーを自動的に表示しながら垂直スクロールバーを非表示にします。

IE 互換性:

IE6 ～ 7 は、他のブラウザと同様に、スクロールバー コントロールの CSS3 拡張機能をサポートしています。ただし、IE8 では追加の要件が導入されています:

-ms-overflow-y: hidden;

この行は、IE8 標準モードでの下位互換性を確保し、潜在的な Microsoft 実装の変更に対処します。

追加メモ:

• IE に水平スクロール バーと垂直スクロール バーが両方とも存在する可能性があることは注目に値します。バグに。他のブラウザでテストすると問題が確認されるはずです。
• IE8 ではバグの修正が導入される可能性があり、IE8 用の追加の CSS コードは不要になります。

以上がCSS Div要素で水平スクロールバーのみを表示するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。