CSS3

プロパティ

hyphens

→●、mdn

ハイフン化。

このプロパティは、テキスト行の中で、［自動折り返し機会を作成するようなハイフン化］を更に許容するかどうかを制御する。

none

単語は、内側の文字が明示的にハイフン化機会を定義していても、ハイフン化されない。

注記： これは、［文字［「-」 U+002D HYPHEN-MINUS／「‐」U+2010 HYPHEN］などの常に可視な文字］により導入される既存の自動折り返し機会は、抑止しない。

<DIV style="border:1px solid red; width:100px; font-size:20px; letter-spacing:0;
 hyphens:none;
">abcdefghijkl
</DIV>

<DIV style="border:1px solid red; width:100px; font-size:20px; letter-spacing:0;
 word-break:break-all;
 hyphens:none;
">abcdefghijkl
</DIV>

<DIV lang=en style="border:1px solid red; width:100px; font-size:20px; letter-spacing:0;
 -webkit-hyphens:none;
 -ms-hyphens:none;
 hyphens:none;
">abcdefghijkl
</DIV>

manual

単語がハイフン化されるのは、内側の文字が明示的にハイフン化機会を示唆する所に限られる。

Unicode では、U+00AD は 条件付き“ソフトハイフン（soft hyphen）”とされ、U+2010 は無条件なハイフンとされる。[UAX14] は、Unicode の行分断法における ソフトハイフンの役割 を述べている。HTML においては、­【Soft HYphen】がソフトハイフン文字を表現し、ハイフン化機会を示唆する。

ex­ample

<DIV style="border:1px solid red; width:100px; font-size:20px; letter-spacing:0;
 hyphens:manual;
">
 abcdefg&shy;hijkl<BR>
 abcdefg&#xad;hijkl<BR>
 abcdefg&#x2010;hijkl<BR>
</DIV>

word-break:break-all を入れると、­、­ で出ない。

<DIV style="border:1px solid black; width:100px;
">abcdefg&shy;hijkl<BR>
</DIV>

hyphens:manual を入れなくても­でハイフンは出る

auto

単語は、［条件付きハイフンにより明示的に指示されるもの］に加えて、［言語に適切なハイフン化リソースにより自動的に決定される、ハイフン化機会］の所でも分断されてよい。単語が条件付きハイフン ― ­（U+00AD SOFT HYPHEN） ― を包含する場合、それが選好される。しかしながら、［そのような機会で分断した後でも、その単語のある部位が 1 行に収まるには、まだ長過ぎる］場合には、自動的なハイフン化機会も利用してよい。

<DIV style="border:1px solid red; width:100px; font-size:20px; letter-spacing:0;
 hyphens:auto;
">abcdefghijkl
</DIV>

<DIV style="border:1px solid red; width:100px; font-size:20px; letter-spacing:0;
 word-wrap:break-word;
 hyphens:auto;
">abcdefghijkl
</DIV>

¶

<DIV lang=en style="border:1px solid red; width:100px; font-size:20px; letter-spacing:0;
 -webkit-hyphens:auto;
 -ms-hyphens:auto;
 hyphens:auto;
">abcdefghijkl
</DIV>

lang=en、-webkit-hyphens、-ms-hyphens を入れてハイフンが出るようになった。しかし、位置が悪い。

正しい自動的なハイフン化は、分断されるテキストの言語に適切なハイフン化リソースを要求する。したがって、ユーザー エージェントは、［内容言語 が既知である、かつ、それに適切なハイフン化リソースがある］場合に限り、テキストを自動的にハイフン化するものとする。

正しい自動的なハイフン化を得るためには、作者は、内容の言語に正しいタグをあてがうべきである（例：［HTML 内では lang 属性／XML 内では xml:lang 属性］を利用して）。

¶以下省く

テスト