CSS と JavaScript でクロスブラウザーのワードラッピングを実現するにはどうすればよいですか?

DDD
リリース: 2024-11-12 13:31:02
オリジナル
415 人が閲覧しました

How to Achieve Cross-Browser Word Wrapping in CSS and JavaScript?

Div 内の長いテキストに対する CSS および JavaScript でのクロスブラウザー ワードラップ

問題:

事前に決定された幅の div 内でスペースを区切らずに長いテキストを折り返すのは、ブラウザーをまたぐ課題です。オーバーフローや文字列への特殊文字の挿入などの従来の方法には制限や欠点があります。

CSS ソリューション:

CSS プロパティ word-wrap:break-word; の利用この問題を解決します。 FireFox、Opera、Safari を含むすべての主要なブラウザでテキストの回り込みをサポートします。

コード例:

.wordwrap {
    word-wrap: break-word;
}
ログイン後にコピー

このスタイルシート クラスにより、テキストの改行が可能になります。

追加メモ:

  • ワードラップ プロパティは、Internet Explorer 5.5 およびすべての最新のブラウザーでサポートされています。 .
  • ワードラップを no_wordwrap などの他の CSS プロパティと組み合わせると、ラップ動作を制御できます。例:
.no_wordwrap {
    word-wrap: normal;
}
ログイン後にコピー

以上がCSS と JavaScript でクロスブラウザーのワードラッピングを実現するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート