長い文字を自動的に折り返す (URL や電子メール アドレスなど) 目的: 非常に長い文字列を自動的に折り返すようにしますが、短い単語を途中で区切らないようにします。
その方法は次のとおりです。
- <スタイル>
- ディブ{
- width:300px;overflow:hidden;/* FF、Opera の場合は固定幅、余分な文字を非表示にします*/
- word-wrap:break-word;word-break:normal;/* IE、Safari では自動行折り返しをサポート*/
- }
- スタイル>
|
IE、Firefox、Opera、Safari で次のコードを実行すると、次の内容を確認できます。
- <スタイル type = "テキスト/CSS" >
- div{幅:200ピクセル;背景:赤;オーバーフロー:非表示;ワードラップ:ブレイクワード;ワードブレイク:ノーマル;}
- スタイル>
- < div >おめでとうございます
- 長い文字 (URL や電子メール アドレスなど) を折り返す:
- http://www.div-css.com/html/standard/base/81857.html
- SDFG 一部の単語にスペースがあります...
- XXXXXXXXXXXXDGXXXXXXXXYYYYDFGYYXXXXXXXSDGXXXXXXXXXXXXyXXXXXXXXXXx空白文字: nowrap
- 一部の中国語フォント 一部の中国語フォント 一部の中国語フォント 一部の中国語フォント 一部の中国語フォント 一部の中国語フォントは折り返されない場合があります
- Webの標準化< a href = "http://www.div-css.com" _fcksavedurl = "http://www.div-css.com" > www.div-css.com a >
- 漢字 中国語 漢字 中国語 英語 漢字 中国語 英語 中国語 英語 中国語 英語 中国語 英語 中国語 英語 中国語 英語 中国語 英語
-
|
また、Firefox で JS を使用して長い文字列を自動的にラップする方法については、ラップ後の文字列が元の文字列ではなくなるため、推奨されません。アドレスを再度コピーすると、元のアドレスは取得されなくなり、途中にスペースが生じます。それはすでに別のリンクです。
