長い英語のリンク先を自動的に改行をさせる方法

3月の半ばに入り日にちが経ちますが…

中学校や小学校の卒業式がそろそろ近づいてきてますね。

でも、外に出かけるとほぼマスクをしてる人が多いんですね…

さてと、話題に入りましょう!

長い英語のリンク先を自動的に改行をさせる方法

ある業者が作成したホームページを見たところ、英語のリンク先が全く自動的に改行されてないことを気づいてなかったそうです。

こっちはレスポンシブで確認したところ、英語のリンク先がそのまま改行されず続けて表示されてました。

その解決先の方法として伝授します。

使い方は二つがありますが、こっちはいつも二つを設定しておいてます。

*{
	overflow-wrap: break-word;
	word-wrap: break-word;
}

まずは一つ目のoverflow-wapの使い方の解説しますね。

overflow-wrap:break-word;(または、word-wrap:break-word;)を使う場合は、禁則処理が保持されます。

なるべく単語の途中で改行されないように自動的に処理されます。
(※英語の単語だけがなぜか有効になってます。)

英語のサイトや日本語のサイトの中に、英訳を行う時の場合、単語の途中での改行は基本的にはしないので、この方法で改行の処理を行うとかなり読みやすいように自動的に改行処理してくれます。

これはかなり、非常的に重宝されますのでお勧めです。

そして、その次がword-wrapの使い方の解説しますね。

これは全く見かけないかもしれませんが、自動的に文章の折り返し。

この仕様での折り返しは一切の禁則処理が無視されてしまいます。

禁則処理とは、日本語で言えば句読点(。、)が文章の先頭に来ないようにしたりとか、「っ ゃ ゅ ょ」などの小さな文字が先頭に来ないようにする処理を行います。

文頭にあってはならないとされる物を正しく処理し、文章の先頭へ配置される事がないように処理してくれる機能です。

メインに日本語サイトにはよく使われます。

使い方の解釈についてはまた明日説明しますね。

では、また!

コメントする

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

Leonard-Blogをもっと見る

今すぐ購読し、続きを読んで、すべてのアーカイブにアクセスしましょう。

続きを読む