web-dev-qa-db-ja.com

必要なときだけdivのスクロールバーを見えるようにするにはどうすればいいですか?

私はこのdivを持っています:

<div style='overflow:scroll; width:400px;height:400px;'>here is some text</div>

テキストがオーバーフローしなくても、スクロールバーは常に表示されます。スクロールバーを必要なときだけ見えるようにしたい - つまり、ボックスに十分なテキストがあるときだけ見えるようにする。 textareaのようにします。どうやってこれをするの?それともdivのように見えるようにtextareaをスタイルするための私の唯一のオプションですか?

126
Benubird

overflow: autoを使用してください。スクロールバーは必要なときにだけ表示されます。

(傍注、xまたはyスクロールバー(overflow-x: autoおよびoverflow-y: auto)のみを指定することもできます)。

255
Hidde

これを試して:

<div style='overflow:auto; width:400px;height:400px;'>here is some text</div>
12
kleinohad

やってみる

<div id="boxscroll2" style="overflow: auto; position: relative;" tabindex="5001">
6
GrvTyagi

やってみる

<div style='overflow:auto; width:400px;height:400px;'>here is some text</div>
6
pbaris

あなたは以下の一つで試すことができます:

  <div style="width: 100%; height: 100%; overflow-x: visible; overflow-y: scroll;">Text</div>
0
Papun Sahoo

テキストがあるかないかにかかわらず、divの高さがまだ表示されていることがわかりました。それで、あなたは最高の結果のためにこれを使うことができます。

<div style=" overflow:auto;max-height:300px; max-width:300px;"></div>
0