みかおば
📘 HTML初心者のみかおばです！
今回は、普通に書くと消えてしまう「<」「>」「©」などの記号を正しく表示する方法を紹介します😊
文字実体参照（エンティティ参照） を覚えておけば安心です！
🔣 記号が表示されないのはなぜ？
HTMLでは < や > が タグの記号 として使われるため、そのまま書くと「タグの始まり／終わり」と解釈されてしまいます。
その結果、画面に文字として表示されないんです。
💡 用語解説：文字実体参照（エンティティ参照）とは？
HTMLでは < や & など、一部の記号が特別な意味を持っています。
そのまま書くと「タグ」と勘違いされてしまうため、**特別な書き方（暗号のような表記）**で文字として表示させます。
👉 この「&○○;」という形を 文字実体参照（エンティティ参照） と呼びます。
例
<→<>→>&→&©→©
📌 簡単に言うと
「HTMLに誤解されないように、特別な書き方で記号を表示する仕組み」です。
📌 よく使う文字実体参照
| 表示したい記号 | 書き方（エンティティ） | 実際の表示 |
|---|---|---|
| < | < | < |
| > | > | > |
| & | & | & |
| “ | " | “ |
| ‘ | ' | ‘ |
| © | © | © |
| ® | ® | ® |
| ¥ | ¥ | ¥ |
| （空白） | | ␣ ← 半角スペースが消えずに残る |
✏️ 使い方の例
コード例
<p>この記号は < と > で囲まれています。</p>
<p>著作権マークは © 2025 みかおば</p>
<p>価格は 1000 円 と表示できます。</p>
👇 表示結果：
この記号は < と > で囲まれています。
著作権マークは © 2025 みかおば
価格は 1000 円 と表示できます。
✅ ポイントまとめ
<や>はタグと区別するために エンティティ参照 を使う<,>,©など よく使うものだけ覚えれば十分！ を使うと 半角スペースを消さずに残せる のも便利
HTMLやデザインに興味がある方に、おすすめリンクです👇
📌 次回予告
【第19回】よくあるHTMLエラーと対処法
→ 閉じタグ忘れや全角スペースなど、初心者がつまずきやすいエラーと解決方法を紹介します！
🔖 この回で出てきたタグ・属性
コメント