早急な日本語タイトルのクイックHTML/CSSハック

英語でこの記事を読みながら、テキストの各行の最後を見てください.ありがとうございます<space> 改行文字で中断されないunbreakableな塊に単語をきれいに分ける文字.言葉は言葉を切り刻みます.
日本語は一般にスペースを使わない.日本語を読んでいる人は、単語という言葉が始まって、文法と文脈に基づいて停止するところで、「spideyセンス」を持っています.
記事の本文のようなテキストの大きなブロックについては、多文字「語」が改行で分割されるのは一般的です.これはOKです.  文字は、モノラルとパラグラフは、審美的に心地よいブロックを維持します.英語:トランプの言葉.

朝日新聞(下段のテキストは一番上から下まで、右から左へ).
単語の位置に関係なく、各改行が同じ場所でどのように中断するかを上に示します.日本語で必要なハイフン!
“Newlinesトランプの言葉”は、テキストの大規模なブロックでは素晴らしく見えますが、それはタイトルのような孤独な1行のテキストに気まずい.
例えば、この教科書では「体の部分を学ぶ」

<h2>体の部分を学ぶ</h2>

デフォルト"PEZディスペンサー"動作
スペース文字やハイフンなしで単語を区切るためにブラウザを指示すると、デフォルトの動作はペッツディスペンサーでペッツキャンディのように1つずつ文字をポップするだけです.
これはリサイズ時に起こっていることと等価です.

Learn body part
s
Learn body par
ts
Learn body pa
rts
...

我々は、これが醜くて読めないと同意することができますか?
PEZの調剤を禁止し、複合文字をこの日本語のタイトルに貼り付けるのを防ぐには、表示に必要な塊をラップします.inline-block スタイル.
HTML

<h2>
  <span class="w">体の</span>
  <span class="w">部分を</span>
  <span class="w">学ぶ</span>
</h2>

<!-- 

CSS style:

.w {
  display: inline-block;
}

-->

ペンス調剤でない
より良い!

自動化!
この解決策は、時折目を引くタイトルの罰金を迅速に修正されますが、どこに置くかを知るために日本語文法の知識が必要です<span> タグ.
幸いにもクールなツールと呼ばれるBudou この書式を自動化します.あなたも日本語を知らない - これは、単語を意味的にテキストを解析し、あなたのためのスパンを挿入するためにAIを使用して(それは中国語、韓国語の作品も!).
これはおそらく私のウェブサイトを日本語に翻訳するときに見落としたことについて多くの記事になるでしょう.
私の子供の本ウェブサイトの上でかなりの日本の線ラッピングを見てください:The Power of Vegetables
鹿のイラスト
この記事はもともと投稿されたMedium