CSS 'div' 要素で水平スクロールバーを制御する方法

CSS 'div' 要素での水平スクロールバーの制御

CSS で 'div' コンテナを操作する場合、水平スクロールバーのみが必要な状況に遭遇することがあります。この記事では、この動作を実現する方法について説明します。

提供されたコード スニペットでは、「overflow」プロパティを「auto」に設定しています。これにより、コンテンツが指定された幅または高さを超えた場合に水平スクロールと垂直スクロールの両方が可能になります。 。水平面へのスクロールを制限するには、「overflow-y」プロパティを次のように変更します。

div#tbl-container {
    overflow: hidden;
    overflow-y: auto;
    scrollbar-base-color: #ffeaff;
}

「overflow-y」を「auto」に設定すると、コンテンツの高さが超えた場合に自動垂直スクロールが許可されます。 「div」の高さ、「overflow」が「hidden」に設定されていると、コンテンツの幅が指定された「div」の幅を超えない限り、水平スクロールが防止されます。

Internet Explorer (IE) バージョン 6 ～ 7 では、追加の垂直スクロールバーを抑制するには CSS3 拡張子が必要です:

div#tbl-container {
    overflow: auto;
    overflow-y: hidden;
    scrollbar-base-color: #ffeaff;
    -ms-overflow-y: hidden;
}

この '-ms' プレフィックスは、Microsoft が独自の名前空間で事前候補推奨の標準プロパティを指定しているため、IE8 に対応するために採用されています。

IE8 がこのバグに対処し、「-ms」プレフィックスの必要性を排除した可能性があることは注目に値します。それにもかかわらず、上記の CSS 変更により、「div」要素のスクロールバーを制御する際に望ましい結果が得られるはずです。

以上がCSS 'div' 要素で水平スクロールバーを制御する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。