HTML
特殊文字がそのまま表示されない（<や>）
HTMLの特殊文字をエスケープしていない
こんな症状
HTML内で<, >, &などの特殊文字がタグとして解釈されてしまう。コード例を表示したいときに起きやすいよ。
まず試す
< は <、> は >、& は & に書き換える。
html
<p>A < B</p>
<!-- < は <、> は >、& は & -->これで直らなければ、下の「自分のケース」を確認。
🔍 自分のケースはどれ？
- ✓< がタグとして消える
→ < と書く。 - ✓& 以降がおかしくなる
→ & と書く。 - ✓コード例を表示したい
→ <code> / <pre> で囲み、中の特殊文字をエンティティにする。
なぜ起きる？
HTMLでは<, >, &は特別な意味を持つ文字（メタ文字）だよ。<はタグの開始、>はタグの終了、&はエンティティの開始として解釈されるんだ。これらの文字をそのまま表示したい場合は、HTMLエンティティに変換する必要があるよ。
✕ エラーが起きるコード
<p>A < B</p>
<!-- < がタグと解釈される -->✓ 直したコード
<p>A < B</p>
<!-- エンティティを使う -->✅ 直ったか確認
意図した <, >, & の文字がそのまま画面に表示されればOK。
この解決法は役立ちましたか？
🔗 関連するエラー
- 画像が表示されない — 画像パスが間違っている
- ページのレイアウトが崩れる — タグの閉じ忘れ
- リンクをクリックしても何も起きない — href 属性の書き忘れ
- 文字化けする — charset の指定がない
- フォームの送信ボタンが動かない — type="submit" の書き忘れ
🔗 別カテゴリの関連エラー
📖 この問題を学べるレッスン
✏️ 手を動かして練習
📝 関連ブログ記事
- プログラミングのエラーメッセージの読み方 — エラーの読み方を基礎から解説
- HTMLとは？初心者向けにわかりやすく解説 — タグの書き方・ページ構造の基本
- HTMLのパス（相対パス・絶対パス）の書き方 — パスの書き方を初心者向けに解説