itlabo https://blog.hatena.ne.jp/itlabo/ フロントエンドエンジニアのスターティングノート https://www.flavor-of-life.com/ はじめに Webページで改行といえばタグですが動的に生成された文書に改行を入れるのは難しいもの。 そんな時は、CSSのword-breakプロパティが便利です。今回はword-breakを使ってHTMLの改行を制御する方法を紹介します。 word-break: break-all div { word-break: break-all; } このように指定した場合、単語が行の端に達した場合、単語を折り返して改行します。 word-break: keep-all div { word-break: keep-all; } このように指定した場合、日本語など(アジア言語)を含む文章では、単語の途中… 190 <iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fwww.flavor-of-life.com%2Fentry%2Fhow_to_html_css_word_break" title="【HTML】Webページで改行コード(¥n)で改行したい！そんな時に役立つword-breakプロパティ！ - フロントエンドエンジニアのスターティングノート" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;"></iframe> Hatena Blog https://hatena.blog 2024-03-12 00:00:00 rich https://www.flavor-of-life.com/entry/how_to_html_css_word_break 1.0 100%