HTMLのvalue属性に使えるUnicodeスペース
= よく使われるUnicodeスペース文字一覧 =
記号・符号・特殊文字目次
Unicodeスペースとvalue属性
💡 HTMLの value 属性と特殊文字について
HTMLでは、スペースを表現するために (ノーブレークスペース)などの
実体参照(エンティティ)が使われますが、
value 属性内では意図通りに機能しないことがあります。
① value 属性では などが反映されないことがある
たとえば次のようなコードは、スペースが表示されない場合があります。
<input type="text" value="例 例">
これは属性値ではHTMLエンティティが正しく解釈されないためです。
② Unicodeスペース文字を使うと正しく表示できる
代替手段として、Unicodeのスペース文字を直接入力することで、
value 属性内でも見た目どおりの空白を表現できます。
たとえば、U+2009(Thin Space)を使った例:
<input type="text" value="例 例">
(この「 」は U+2009 の Thin Space です)
✅ よく使われるUnicodeスペース文字一覧
| 名称と 用途の目安 |
HTML 表記 |
コードポイント | Unicode 文字 |
使用例 |
|---|---|---|---|---|
| No-break Space
一般的な強制空白
|
| U+00A0 | "例 例" |
|
| Thin Space
ごく小さい空白
|
  | U+2009 | "例 例" |
|
| Hair Space
さらに小さい空白
|
  | U+200A | "例 例" |
|
| Four-Per-Em Space
中くらいの空白
|
  | U+2005 | "例 例" |
|
| Six-Per-Em Space
Em幅の1/6。細かい字間調整に
|
  | U+2006 | "例 例" |
|
| Punctuation Space
句読点のためのスペース。
句読点幅に相当 |
  | U+2008 | "例 例" |
|
| En Space
全角の半分の幅
|
  | U+2002 | "例 例" |
|
| Em Space
全角スペース相当
|
  | U+2003 | "例 例" |
|
| Narrow No-Break Space(NNBSP)
絶対に改行されない狭い空白
(例:フランス語記号の前後など) |
  | U+202F | "例 例" |
|
| Medium Mathematical Space
数式で使われる中くらいの空白
|
  | U+205F | "例 例" |
