1

divHTML ページのタグにテキスト値を動的に追加する必要があります。divしかし、このテキストが長すぎると、として割り当てた幅にとどまらず500px、1 行でまっすぐ長くなり、Web ページが横スクロールになります。このテキストの長さを修正するにはどうすればよいですか。数が増えても行数が増えても構いません。

Css は次のとおりです。

.question
{
    width: 500px;
    height: auto;
    float: left;
    overflow: auto;

}
.answer
{
    width: auto;
    height: auto;
    float:left;
    overflow: auto;

}
#main
{
    width: 1000px;
    height: auto;
    overflow: auto;

}

JSコードは次のとおりです。

function create_div_dynamic(answer){

     var dynDiv = document.createElement("div");
     dynDiv.id = "divDyna"+counter;

     var question_data = question();
     var answer_data= answer();
     dynDiv.innerHTML="<div id='main'  ><div class='question'> "+question_data+" </div> <div class='answer'> "+answer_data+"</div> </div>"
     dynDiv.style.height = "auto";
     dynDiv.style.width = "auto";     
     dynDiv.style.backgroundColor = 'gray';
     document.body.appendChild(dynDiv);
     counter=counter+1;


    }
4

4 に答える 4

3

css で word-wrap ルールを使用できます。

すなわち:

word-wrap:break-word;

ただし、これは CSS3 であり、すべてのブラウザーでサポートされているわけではありません。

于 2012-11-02T10:22:54.887 に答える
0

テキストの内容と適用されているスタイル シートを分析して、通常のワード ラッピングを妨げている原因を特定し、原因を取り除くか結果に対処する必要があります。

于 2012-11-02T11:16:54.423 に答える
0

このスタイルを div に追加してください。

<div style="width=500px; display: inline-block; text-align: justify;"> text </div>

于 2012-11-02T10:28:25.880 に答える
0

style="width:20px;" を使用するだけです。これにより、div のサイズが 20px になります。ただし、スペースが存在しない場合、div は自動的に最大の作品の長さにサイズ変更されます。非表示にしたい場合（divを必要なサイズに正確に作成する）、ダイビングのサイズよりも長い単語を使用できますwidth:20px;overflow:hidden;

于 2012-11-02T10:24:48.583 に答える