2022.7.8|コーディング

HTMLの特殊文字とは?HTMLで使える特殊文字一覧

HTMLの特殊文字とは?HTMLで使える特殊文字一覧

Webサイトを制作する上で、「<」「>」「¥」などの記号が正しく表示されないことがあります。これらの記号をブラウザに表示させる場合は、HTMLの特殊文字(エスケープシーケンス)を使う事で表示することができます。

今回は、HTMLの特殊文字とは?HTMLで使える特殊文字一覧を解説します。

HTMLの特殊文字とは?

HTMLの特殊文字とは、Webサイトを制作する上で「<」「>」「¥」などの特定の文字や記号を直接入力してもブラウザで表示されない場合があります。このように特殊の文字や記号は、HTMLの文字列として扱われてしまいブラウザで表示されない場合がありますが、それらの特殊の文字や記号は、特殊文字(エスケープシーケンス)を使ってブラウザに表示することができます。
特定の文字や記号に変わる文字列を入力することでブラウザに表示することができ、それらの特定の文字や記号に変わる文字れるのことを特殊文字(エスケープシーケンス)と言います。

特殊文字の記述方法

「<」「>」「¥」などの記号は、HTMLの文字列として処理されてしまうため直接入力してもブラウザで表示されない場合があります。これらの特定の記号や文字は特殊文字を利用して記述することでブラウザに表示されます。

例えば、「<」「>」「¥」などの特殊文字は以下のように記述することでブラウザに正しく表示されます。

「<」の特殊文字:&lt;
「>」の特殊文字:&gt;
「¥」の特殊文字:&yen;

特殊文字一覧

よく使われる特殊文字・記号(一部)のご紹介をします。

一般的な特殊記号一覧
記号 読み方 特殊文字(実体参照) 特殊文字(数値参照)
& アンパサンド &amp; &#38;
¦ 破断縦線 &brvbar; &#166;
µ マイクロ記号 &micro; &#181;
パーミル &permil; &#8240;
¤ 一般通貨記号 &curren; &#164;
ユーロ記号 &euro; &#128;
¢ セント記号 &cent; &#162;
£ ポンド記号 &pound; &#163;
¥ 円記号 &yen; &#165;
© 著作権記号 &copy; &#169;
® 登録商標記号 &reg; &#174;
商標記号 &trade; &#8482;
上向き矢印 &uarr; &#8593;
右向き矢印 &rarr; &#8594;
下向き矢印 &darr; &#8595;
左向き矢印 &larr; &#8592;
左右両向き矢印 &harr; &#8596;
改行マーク &crarr; &#8629;
上向き二重矢印 &uArr; &#8657;
右向き二重矢印 &rArr; &#8658;
下向き二重矢印 &dArr; &#8659;
左向き二重矢印 &lArr; &#8656;
左右両向き二重矢印 &hArr; &#8660;
スペードマーク &spades; &#9824;
クラブマーク &clubs; &#9827;
ハートマーク &hearts; &#9829;
ダイヤマーク &diams; &#9830;
ª 女性序数標識 &ordf; &#170;
º 男性序数標識 &ordm; &#186;
¹ 上付き1 &sup1; &#185;
² 上付き2 &sup2; &#178;
³ 上付き3 &sup3; &#179;
½ 2分の1 &frac12; &#189;
¼ 4分の1 &frac14; &#188;
¾ 4分の3 &frac34; &#190;
· 中点 &middot; &#183;
¡ 逆さ感嘆符 &iexcl; &#161;
¿ 逆さ疑問符 &iquest; &#191;
引用符 &quot; &#34;
左一重引用符 &lsquo; &#8216;
右一重引用符 &rsquo; &#8217;
左二重引用符 &ldquo; &#8220;
右二重引用符 &rdquo; &#8221;
« 左二重角引用符 &laquo; &#171;
» 右二重角引用符 &raquo; &#187;
改行なし空白 &nbsp; &#160;
“m”幅空白 &emsp; &#8195;
“n”幅空白 &ensp; &#8194;
狭い空白 &thinsp; &#8201;
“m”幅ダッシュ &mdash; &#8212;
“n”幅ダッシュ &ndash; &#8211;
­ ソフトハイフン &shy; &#173;
行頭文字 &bull; &#8226;
段落記号 &para; &#182;
§ セクション記号 &sect; &#167;
ダガー記号 &dagger; &#8224;
ダブルダガー記号 &Dagger; &#8225;
省略記号 &hellip; &#8230;
菱形 &loz; &#9674;
上線 &oline; &#8254;
区切りスラッシュ &frasl; &#8260;
数学・その他特殊記号一覧
記号 読み方 特殊文字(実体参照) 特殊文字(数値参照)
無限記号 &infin; &#8734;
根号 &radic; &#8730;
マイナス &minus; &#8722;
± プラスマイナス &plusmn; &#177;
× 乗算記号 &times; &#215;
÷ 除算記号 &divide; &#247;
等しくない &ne; &#8800;
ほぼ等しい &asymp; &#8776;
およそ等しい &cong; &#8773;
> 大なり &gt; &#62;
< 小なり &lt; &#60;
大なりまたは等しい &ge; &#8805;
小なりまたは等しい &le; &#8804;
ƒ 関数記号 &fnof; &#402;
比例する &prop; &#8733;
プライム &prime; &#8242;
二重プライム &Prime; &#8243;
積分記号 &int; &#8747;
偏微分 &part; &#8706;
ナブラ &nabla; &#8711;
数列の和 &sum; &#8721;
数列の積、直積 &prod; &#8719;
虚数 &image; &#8465;
実数 &real; &#8476;
ワイエルシュトラスのP &weierp; &#8472;
チルダ演算子 &sim; &#8764;
故に &there4; &#8756;
ϖ パイ記号 &piv; &#982;
&ang; &#8736;
° 度記号 &deg; &#176;
直交する &perp; &#8869;
合同な &equiv; &#8801;
¬ 否定記号 &not; &#172;
任意の &forall; &#8704;
存在する &exist; &#8707;
論理積 &and; &#8743;
論理和 &or; &#8744;
空集合 &empty; &#8709;
集合積 &cap; &#8745;
集合和 &cup; &#8746;
~の要素である &isin; &#8712;
~の要素ではない &notin; &#8713;
~を要素として含む &ni; &#8715;
含まれる &sub; &#8834;
含む &sup; &#8835;
含まれない &nsub; &#8836;
含まれるか等しい &sube; &#8838;
含むか等しい &supe; &#8839;
点演算子 &sdot; &#8901;
アスタリスク演算子 &lowast; &#8727;
丸囲み加算(直和) &oplus; &#8853;
丸囲み乗算(直積) &otimes; &#8855;
左上限 &lceil; &#8968;
左下限 &lfloor; &#8970;
右上限 &rceil; &#8969;
右下限 &rfloor; &#8971;

まとめ

文字や記号の特殊文字はWebサイトの作成時にも役立ちます。全てを覚えるのは難しいですが、必要な記号や使いそうな記号はある程度把握しておくと良いです。また、Webサイトだけでなくツールを使ったブログサイトなどにも役立ちます。