hyphens

これは実験段階の機能です。
この機能は複数のブラウザで開発中の状態にあります。各ブラウザで用いるために、適切なベンダー接頭辞が必要な場合があります。互換性テーブルをチェックしてください。また、実験段階の機能の構文と挙動は、仕様変更に伴い各ブラウザの将来のバージョンで変更になる可能性があることに注意してください。

概要

hyphens プロパティは、行が折り返される際にテキストをより良く配置するため、ブラウザが単語をどのように分割するかを設定します。

注: どのようにハイフネーションを行うかの規則は仕様書で明確に定義されていないため、正しいハイフネーションの方式はブラウザにより異なります。

構文

hyphens:  none | manual | auto

none
単語内に改行位置を示す文字が含まれていても、単語は改行で分割されません。行はホワイトスペースの位置でのみ折り返されます。
manual
単語は行送りの際に、単語内にある改行位置を示す文字でのみ分割されます。詳しくは 改行候補位置を示す を参照してください。
auto
ブラウザは自身が選択した規則に従って、ハイフネーションを行うのに適切な位置で自動的に単語を分割します。改行候補位置を示す で扱っている改行候補位置は、可能であれば自動的に改行位置として選択されます。
注: auto 設定の動作は、ハイフネーションの規則を選択するため適切にタグ付けされた言語に依存します。自動ハイフネーションを適用するためには、言語を lang HTML 属性で指定する必要があります。

改行候補位置を示す

テキスト中で改行が可能な位置を手動で指定するために使用することができる Unicode 文字は、2 つあります:

U+2010 (HYPHEN)
"ハード" ハイフン文字は、目に見える改行候補位置を示します。実際はその位置で改行されない場合でも、ハイフンが表示されます。
U+00AD (SHY)
不可視の "ソフト" ハイフンです。この文字は表示されません。しかし、ブラウザが必要に応じて単語を分割することができる位置を示します。HTML では、­ を用いてソフトハイフンを挿入することができます。

以下の CSS では 3 つのクラスを作成しており、それぞれが hyphens プロパティで指定可能な設定になります。

p.none {
  -webkit-hyphens: none;
     -moz-hyphens: none;
      -ms-hyphens: none;
          hyphens: none;
}
p.manual {
  -webkit-hyphens: manual;
     -moz-hyphens: manual;
      -ms-hyphens: manual;
          hyphens: manual;
}
p.auto {
  -webkit-hyphens: auto;
     -moz-hyphens: auto;
      -ms-hyphens: auto;
          hyphens: auto;
}

これらの設定がどのように働くか、live example で確認してください。その動きを見るために、live example を表示した状態でウィンドウをリサイズしてください。

実際の表示を確認

仕様

仕様書 策定状況 コメント
CSS Text Level 3 草案  

ブラウザ実装状況

機能 Chrome Firefox (Gecko) Internet Explorer Opera Safari
基本サポート 13 -webkit 6.0 (6.0)-moz
※Gecko にハイフネーション辞書が搭載されている言語のみで動作
10.0 -ms
※Internet Explorer にハイフネーション辞書が搭載されている言語のみで動作
? 5.1 -webkit
機能 Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
基本サポート ? 6.0 (6.0) -moz
※Gecko にハイフネーション辞書が搭載されている言語のみで動作
? ? ?

サポート言語一覧

ブラウザは以下の言語のハイフネーション辞書を提供します。

言語 Firefox IE
Afrikaans (af) 8.0  
Bulgarian (bg) 8.0  
Catalan (ca) 8.0 10.0
Czech   10.0
Swiss German, Traditional Orthography (de-CH) 8.0  
Danish (da) 8.0 10.0
Dutch (nl) 8.0 10.0
English (en) ?? 10.0
English, United States (en-US) 6.0 10.0
Esperanto (eo) 8.0  
Estonian (et) 8.0  
Finnish (fi) 8.0  
French (fr) 8.0 10.0
Galician (gl) 9.0  
German, Traditional Orthography (de-1901) 8.0 ??
German, Reformed Orthography (de-1996) 8.0 10.0
Hungarian (hu) 9.0  
Icelandic (is) 8.0  
Interlingua (ia) 8.0  
Italian (it) 9.0 10.0
Kurmanji (kmr) 8.0  
Latin (la) 8.0  
Lithuanian (lt) 8.0  
Mongolian (mn) 8.0  
Norwegian Bokmål (nb) 8.0 10.0
Norwegian Nynorsk (nn) 8.0 10.0
Polish   10.0
Portuguese (pt) 8.0 10.0
Brazilian Portuguese   10.0
Russian (ru) 8.0 10.0
Serbo-Croatian (sh) 8.0  
Slovenian (sl) 8.0  
Spanish (es) 8.0 10.0
Swedish (sv) 8.0 10.0
Turkish (tr) 9.0 10.0
Ukrainian (uk) 9.0  
Upper Sorbian (hsb) 8.0  
Welsh (cy) 8.0  

関連情報

Document Tags and Contributors

Contributors to this page: FredB, ethertank, yyss
最終更新者: ethertank,
サイドバーを隠す