1

ページにログを表示する必要がありますが、ログには非常に長い行があり (これは apache access_log です)、見苦しく判読できません。

水平スクロールバーでコンテンツを表示するにはどうすればよいですか?

私はブートストラップを使用してoverflow : auto/scrollおり、高さ/幅を使用して修正しようとしましたが成功しませんでした。

編集：これが私のコードです

<div class="well" style="overflow-x: scroll;width:200px;" >
<?php
    echo $log;
?>
</div>

$log に<br/>は新しい行が含まれます

4

4 に答える 4

1 
<div style="overflow-x: scroll;white-space:nowrap;width:200px;
height:200px;border:1px solid red" >
    A Very long line gjkdddddssssss sssssssssssssssssssss ssssssssssss
ssssssssssss ssss
ssssssss
ssssssssssssss sssssssssssssssssssssssss ss
sssssssssssssssssss ssssssssssssssssssssssss
    </div>​

ホワイトスペースは、設定する必要のあるプロパティです。

デモ： http： //jsfiddle.net/amandeepj/ZQuKG/

于 2012-08-31T08:48:21.263 に答える
0

こんにちは今これに慣れています

HTML

<div class="ok">heli msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample helo i msample </div>

Css

    .ok{
    background:red;
      width:200px;
      height:200px;
      overflow:scroll;
word-break: break-all;
    }

デモ

于 2012-08-31T08:26:23.533 に答える
0

overflow-x出力に使用する必要があります

http://www.css3.info/overflow-xoverflow-y/

このリンクからより良い情報を得ることができるので、このことを理解することができます

于 2012-08-31T08:24:17.277 に答える
0

改行を防ぐには、
CSSを使用します。

p {
    white-space: nowrap;
}

次に、プロパティでスクロールを制御できoverflowます。

于 2012-08-31T08:29:15.770 に答える