web-dev-qa-db-ja.com

水平スクロールバー

コンテンツが境界線でオーバーフローする場合、ページに自動水平スクロールバーを作成するにはどうすればよいですか。

<html>
     <body>
        <div style ="width: 20px; height:30px; border:1px solid black; overflow:auto">
            <!-- various of text here that can makes it go out the border-->
        </div>  
     </body>
</html>

コンテンツのテキストが長すぎる場合、自動水平スクロールバーを作成するにはどうすればよいですか？

csshtmlscrollbar
4
ggcodes

コードを次のように変更します。

 <html>
 <body>
    <div style ="width: 20px; height:30px; border:1px solid black; overflow-x:scroll">
        <!-- various of text here that can makes it go out the border-->
    </div>  
 </body>
 </html>
9
SyntaxError

Divスタイルで挿入：

overflow-x:scroll;
11
onimojo
overflow: auto;
white-space: nowrap;

http://jsfiddle.net/GCPDE/

3
clyfish

注：テキストを水平方向にスクロール可能にするには、overflow-x：scroll; overlay-y：hidden; white-space：nowrap;を追加する必要があります。 =あなたのdivに。

<html>
     <body>
        <div style ="width:20px; height:30px; border:1px solid black; overflow-x:scroll; overflow-y:hidden; white-space:nowrap;">
            <!-- various of text here that can makes it go out the border-->
        </div>  
     </body>
</html>
1
Rahul Mehra

スタイルを次のように変更します。

style="width: 20px; height:30px; border:1px solid black; overflow:auto;"

構文が正しくない場合。

1
sooper