1. ホーム
  2. css

CSSを使用して長いテキスト行(スペースなし)を親コンテナの静的幅に従って強制的に改行する [重複]。

2023-09-16 12:41:04

質問

重複の可能性があります。

CSS: 長い文字列 (空白なし) を強制的に XUL および/または HTML でラップするには

次のようなコードがあるとします。

<div style="width:100px;height:1000px">This-is-a-long-line-of-text-without-any-spaces-This-is-a-long-line-of-text-without-any-spaces-This-is-a-long-line-of-text-without-any-spaces-This-is-a-long-line-of-text-without-any-spaces</div>

申し訳ありませんが、スタックオーバーフローは(プレビューによると)コードスニペットを改行しません。

ほとんどの(?)状況で、次のようにすると、長い行のテキストを保持するコンテナが、中に含まれるテキストの幅いっぱいに伸びるようになります。

これを、親コンテナの css 指定幅 (width:100px) に従って強制的に改行 (単語の途中でも) したいのです。

これは私の知らないcssタグで可能なのでしょうか?

IE6+の比較対象、さらにgecko/webkit/operaをお願いします。

どのように解決するのですか?

これを利用して、.NET Frameworkをラップすることができます。

.wrap { 
   white-space: pre-wrap;      /* CSS3 */   
   white-space: -moz-pre-wrap; /* Firefox */    
   white-space: -pre-wrap;     /* Opera <7 */   
   white-space: -o-pre-wrap;   /* Opera 7 */    
   word-wrap: break-word;      /* IE */
}