最終更新日: 2021年2月16日
HTMLの三角・矢印の特殊文字まとめ！
今回はHTMLコーディングでよく利用する三角・矢印の特殊文字をまとめてご紹介します。特殊文字をきちんと使わないと、実際のソースコードでは記号が表示されているのにブラウザで見ると表示されなかったり、文字化けを起こす場合もあります。きちんと表示されるように特殊文字を使いましょう！
コンテンツ [表示]
HTMLで記号や空白などを入力してもうまく表示されないことはないですか？
それは主に下のような理由が考えられます。
ちゃんと表示されない主な理由
- 特殊記号や文字をHTMLタグと区別するため
- HTMLタグによる不正な動作がおこなわれないように処理するため
- Shift-JISやutf-8などの文字コードの違いのため
そこで、今回は特殊文字（エスケープシーケンス）を使って、HTMLコーディングでよく利用する三角・矢印をご紹介します。
特殊文字を使うと、安全にかつ文字化けせずに特定の文字を表示することができます。
コピペで使えますのでぜひ利用してみてください。
HTMLの三角・矢印の特殊文字
三角一覧
| 表示 | 文字実体 | 数値文字 | 説明 |
| △ | △ | △ | 上向き正三角形 |
| ▷ | - | ▷ | 左向き正三角形 |
| ▽ | ▽ | ▽ | 下向き正三角形 |
| ◁ | - | ◁ | 右向き正三角形 |
| ▵ | ▵ | ▵ | 上向き小正三角形(白) |
| ▹ | ▹ | ▹ | 右向き小正三角形(白) |
| ▿ | ▿ | ▿ | 下向き小正三角形(白) |
| ◃ | ◃ | ◃ | 左向き小正三角形(白) |
| ◸ | ◸ | ◸ | 直角三角形(左上) |
| ◹ | ◹ | ◹ | 直角三角形(右上) |
| ◺ | ◺ | ◺ | 直角三角形(左下) |
| ⊿ | ⊿ | ◻ | 直角三角形(右下) |
| ▲ | - | ▲ | 上向き正三角形(黒) |
| ▶ | - | ▶ | 右向き正三角形(黒) |
| ▼ | - | ▼ | 下向き正三角形(黒) |
| ◀ | - | ◀ | 左向き正三角形(黒) |
| ▴ | ▴ | ▴ | 上向き小正三角形(黒) |
| ▸ | ▸ | ▸ | 右向き小正三角形(黒) |
| ▾ | ▾ | ▾ | 下向き小正三角形(黒) |
| ◂ | ◂ | ◂ | 左向き小正三角形(黒) |
矢印一覧
| 表示 | 文字実体 | 数値文字 | 説明 |
| < | < | < | 小なり |
| > | > | > | 大なり |
| ‹ | ‹ | ‹ | 山カッコ (始) |
| › | › | › | 山カッコ (終) |
| « | « | « | 二重山カッコ (始) |
| » | » | » | 二重山カッコ (終) |
| ← | ← | ← | 左矢 |
| ↑ | ↑ | ↑ | 上矢 |
| → | → | → | 右矢 |
| ↓ | ↓ | ↓ | 下矢 |
| ↔ | ↔ | ↔ | 左右矢 |
| ⇐ | ⇐ | ⇐ | 二重左矢 |
| ⇑ | ⇑ | ⇑ | 二重上矢 |
| ⇒ | ⇒ | ⇒ | 二重右矢 |
| ⇓ | ⇓ | ⇓ | 二重下矢 |
| ⇔ | ⇔ | ⇔ | 二重左右矢 |
まとめ
いかがでしたでしょうか？
今回は、三角・矢印を中心にご紹介しましたが、特殊文字はこの他にもまだまだたくさんあります。
特殊文字を使わないことで、記号が表示されなかったりなど、
トラブルの要因の1つになりますので、みなさんも、積極的に使っていきましょう！
