Twitter
このページについてつぶやきます。

Webサイト制作講座

資料室 »

文字参照

茶子先生

以下、文字参照コード一覧です。

管理人的に使用頻度が高いもの

文字実体参照数値文字参照説明
   改行禁止スペース
&&&アンド
<&lt;&#60;小なり
>&gt;&#62;大なり
"&quot;&#34;ダブルクオート（二重引用符）
'&apos;&#39;シングルクオート（アポストロフィー、単一引用符）
«&laquo;&#171;二重山括弧
»&raquo;&#187;二重山括弧
©&copy;&#169;コピーライトマーク（著作権）
®&reg;&#174;登録商標マーク

その他

文字実体参照数値文字参照
¡&iexcl;&#161;
¢&cent;&#162;
£&pound;&#163;
¤&curren;&#164;
¥&yen;&#165;
¦&brvbar;&#166;
§&sect;&#167;
¨&uml;&#168;
ª&ordf;&#170;
¬&not;&#171;
­&shy;&#173;
¯&macr;&#175;
°&deg;&#176;
±&plusmn;&#177;
²&sup2;&#178;
³&sup3;&#179;
´&acute;&#180;
µ&micro;&#181;
&para;&#182;
·&middot;&#183;
¸&cedil;&#184;
¹&sup1;&#185;
º&ordm;&#186;
¼&frac14;&#188;
½&frac12;&#189;
¾&frac34;&#190;
¿&iquest;&#191;
À&Agrave;&#192;
Á&Aacute;&#193;
Â&Acirc;&#194;
Ã&Atilde;&#195;
Ä&Auml;&#196;
Å&Aring;&#197;
Æ&AElig;&#198;
Ç&Ccedil;&#199;
È&Egrave;&#200;
É&Eacute;&#201;
Ê&Ecirc;&#202;
Ë&Euml;&#203;
Ì&Igrave;&#204;
Í&Iacute;&#205;
Î&Icirc;&#206;
Ï&Iuml;&#207;
Ð&ETH;&#208;
Ñ&Ntilde;&#209;
Ò&Ograve;&#210;
Ó&Oacute;&#211;
Ô&Ocirc;&#212;
Õ&Otilde;&#213;
Ö&Ouml;&#214;
×&times;&#215;
Ø&Oslash;&#216;
Ù&Ugrave;&#217;
Ú&Uacute;&#218;
Û&Ucirc;&#219;
Ü&Uuml;&#220;
Ý&Yacute;&#221;
Þ&THORN;&#222;
ß&szlig;&#223;
à&agrave;&#224;
á&aacute;&#225;
â&acirc;&#226;
ã&atilde;&#227;
ä&auml;&#228;
å&aring;&#229;
æ&aelig;&#230;
ç&ccedil;&#231;
è&egrave;&#232;
é&eacute;&#233;
ê&ecirc;&#234;
ë&euml;&#235;
ì&igrave;&#236;
í&iacute;&#237;
î&icirc;&#238;
ï&iuml;&#239;
ð&eth;&#240;
ñ&ntilde;&#241;
ò&ograve;&#242;
ó&oacute;&#243;
ô&ocirc;&#244;
õ&otilde;&#245;
文字実体参照数値文字参照
ö&ouml;&#246;
÷&divide;&#247;
ø&oslash;&#248;
ù&ugrave;&#249;
ú&uacute;&#250;
û&ucirc;&#251;
ü&uuml;&#252;
ý&yacute;&#253;
þ&thorn;&#254;
ÿ&yuml;&#255;
Œ&OElig;&#338;
œ&oelig;&#339;
Š&Scaron;&#352;
š&scaron;&#353;
Ÿ&Yuml;&#376;
ˆ&circ;&#710;
˜&tilde;&#732;
 &ensp;&#8194;
 &emsp;&#8195;
 &thinsp;&#8201;
‌&zwnj;&#8204;
‍&zwj;&#8205;
‎&lrm;&#8206;
‏&rlm;&#8207;
–&ndash;&#8211;
—&mdash;&#8212;
‘&lsquo;&#8216;
’&rsquo;&#8217;
‚&sbquo;&#8218;
“&ldquo;&#8220;
”&rdquo;&#8221;
„&bdquo;&#8222;
†&dagger;&#8224;
‡&Dagger;&#8225;
‰&permil;&#8240;
‹&lsaquo;&#8249;
›&rsaquo;&#8250;
€&euro;&#8364;
Α&Alpha;&#913;
Β&Beta;&#914;
Γ&Gamma;&#915;
Δ&Delta;&#916;
Ε&Epsilon;&#917;
Ζ&Zeta;&#918;
Η&Eta;&#919;
Θ&Theta;&#920;
Ι&Iota;&#921;
Κ&Kappa;&#922;
Λ&Lambda;&#923;
Μ&Mu;&#924;
Ν&Nu;&#925;
Ξ&Xi;&#926;
Ο&Omicron;&#927;
Π&Pi;&#928;
Ρ&Rho;&#929;
Σ&Sigma;&#931;
Τ&Tau;&#932;
Υ&Upsilon;&#933;
Φ&Phi;&#934;
Χ&Chi;&#935;
Ψ&Psi;&#936;
Ω&Omega;&#937;
α&alpha;&#945;
β&beta;&#946;
γ&gamma;&#947;
δ&delta;&#948;
ε&epsilon;&#949;
ζ&zeta;&#950;
η&eta;&#951;
θ&theta;&#952;
ι&iota;&#953;
κ&kappa;&#954;
λ&lambda;&#955;
μ&mu;&#956;
ν&nu;&#957;
ξ&xi;&#958;
ο&omicron;&#959;
π&pi;&#960;
ρ&rho;&#961;
ς&sigmaf;&#962;
σ&sigma;&#963;
文字実体参照数値文字参照
τ&tau;&#964;
υ&upsilon;&#965;
φ&phi;&#966;
χ&chi;&#967;
ψ&psi;&#968;
ω&omega;&#969;
ϑ&thetasym;&#977;
ϒ&upsih;&#978;
ϖ&piv;&#982;
•&bull;&#8226;
…&hellip;&#8230;
′&prime;&#8242;
″&Prime;&#8243;
‾&oline;&#8254;
⁄&frasl;&#8260;
℘&weierp;&#8472;
ℑ&image;&#8465;
ℜ&real;&#8476;
™&trade;&#8482;
ℵ&alefsym;&#8501;
←&larr;&#8592;
↑&uarr;&#8593;
→&rarr;&#8594;
↓&darr;&#8595;
↔&harr;&#8596;
↵&crarr;&#8629;
⇐&lArr;&#8656;
⇑&uArr;&#8657;
⇒&rArr;&#8658;
⇓&dArr;&#8659;
⇔&hArr;&#8660;
∀&forall;&#8704;
∂&part;&#8706;
∃&exist;&#8707;
∅&empty;&#8709;
∇&nabla;&#8711;
∈&isin;&#8712;
∉&notin;&#8713;
∋&ni;&#8715;
∏&prod;&#8719;
∑&sum;&#8721;
−&minus;&#8722;
∗&lowast;&#8727;
√&radic;&#8730;
∝&prop;&#8733;
∞&infin;&#8734;
∠&ang;&#8736;
∧&and;&#8743;
∨&or;&#8744;
∩&cap;&#8745;
∪&cup;&#8746;
∫&int;&#8747;
∴&there4;&#8756;
∼&sim;&#8764;
≅&cong;&#8773;
≈&asymp;&#8776;
≠&ne;&#8800;
≡&equiv;&#8801;
≤&le;&#8804;
≥&ge;&#8805;
⊂&sub;&#8834;
⊃&sup;&#8835;
⊄&nsub;&#8836;
⊆&sube;&#8838;
⊇&supe;&#8839;
⊕&oplus;&#8853;
⊗&otimes;&#8855;
⊥&perp;&#8869;
⋅&sdot;&#8901;
⌈&lceil;&#8968;
⌉&rceil;&#8969;
⌊&lfloor;&#8970;
⌋&rfloor;&#8971;
⟨&lang;&#9001;
⟩&rang;&#9002;
◊&loz;&#9674;
♠&spades;&#9824;
♣&clubs;&#9827;
♥&hearts;&#9829;
♦&diams;&#9830;
光

………文字参照、こいつぁ一体？？？

茶子先生

HTMLソース内にこの文字実体参照、もしくは数値文字参照のコードを記述することで、それに対応した文字や記号をHTML上に表示したりすることができます。
例えば、「&amp;」とHTMLソースに書き込めば、「&」が表示されます。

光

？？
普通に「&」と書き込めばいいじゃないですか？
&&&&&&&&&&&&&……ほらほら、そのままでもきちんと表示されてますけど！？

茶子先生

ふむ。
それじゃあ、次のように表示するには？
――「<a href="web/web800/test.html" target="_blank">test</a>」

光

？？？
えーっと――「test」……あれ？
な、なんだか残念なことに……！？　バグ！？

茶子先生

……まずは自分のミスを疑いましょうね？
HTMLは「<」と「>」で囲まれた部分をタグとして処理します。
なので、この場合、そのまま書き込んじゃうと<a>タグとして処理されるってわけね。

光

なるほど、つまりこの場合は…………
「<」を「&lt;」に置き換えて書き込めということですね！
文字参照、キミは要らない子じゃなかった！！！

茶子先生

この場合は、いわゆるところのエスケープ処理ってやつね。
少なくとも「<」と「&」を文字として表示する際には、文字参照を用いたほうがいいでしょう。
他にもキーボード入力できない記号を表示するのに使ったりもします。

光

文字実体参照と数値文字参照の効果は同じ？
どちらを使えば？？？

茶子先生

文字実体参照のほうがHTMLソース上から何を表してるか理解しやすいので、基本はそちらを使ったほうがいいんじゃないでしょうか。 「'（シングルクオート）」については、数値文字参照が推奨されてますが……。
例えば「©」を表示する場合、「&copy;」と「&#169;」だったら文字実体参照のほうが何を表してるかひと目でわかるでしょう？

光

た、確かに！！
でもこれ……全部覚えるんですか？
私はここに宣言します――　絶　対　無　理　！

茶子先生

フォントやブラウザなどの環境によっては正常に表示されない可能性もあるし、頻繁に使うものでもありません。 こういったものがあるということだけ覚えておいて、あとは必要になったときに確認すればＯＫでしょう。
それに、使用頻繁の高いものは嫌でも覚えますよ（ニコリ）♪

Last Update 2012-02-29