実装方法: 1. "
<div class="pre-scrollable">" 組版クラスを使用してスクロール バーを実装します。 2. "" はスクロール バーを実装します。このチュートリアルの動作環境: Windows 10 システム、ブートストラップ バージョン 3.3.7、DELL G3 コンピューター
スクロール バーを実装する方法bootstrap
1: ブートストラップ スタイルを追加してスクロール バーを追加します
実際には、関連するモジュールの class 属性に pre-scrollable を追加するだけです。
たとえば、
に事前スクロール可能を追加します:<div class="pre-scrollable">ログイン後にコピー
2: overflow を設定してスクロール バーを追加します
幅と高さを設定する必要があることに注意してください。設定しないと機能しません。さらに良い点は、幅と高さが超えない場合、単なる線になることです。<div style="max-width:90%"brush:html;toolbar:false"><div style=" overflow-y:auto; overflow-x:auto; width:400px; height:400px;”></div>ログイン後にコピー
# 3: div のオーバーフロー属性を auto として直接指定するだけですが、次のように div の高さを指定する必要があります:
<div style="max-width:90%"></div>ログイン後にコピー水平スクロール バーを表示したい場合は、overflow-x:auto
同様に、垂直スクロール バーは次のようになります。overflow-y:auto
div が他のオブジェクトに含まれている場合td などの場合、位置は相対に設定できます:position:relative3: スクロール バーを非表示{overflow: hidden ! important;} または {overflow-x: hidden; overflow- y: hidden;} は、x 軸または y 軸のスクロール バーをそれぞれ非表示にできます関連する推奨事項:
ブートストラップ チュートリアル
以上がブートストラップでスクロールバーを実装する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。