コンテンツ概要 このコンテンツは、実例サンプルでみる用途別HTMLタグの解説と、
フォントや特種文字の表示サンプル、カラーチャートなど、
HTMLに関する初心者向けの情報を総合的に扱っています。

>はじめに

HTMLとは
HTMLとは( HyperText Markup Language ) の略で、
タグという手段を使ってPCが情報を読めるようにできる言語です。
現在W3C( World Wide Web Consortium ) という
非営利団体が仕様の定義をおこなっていますが、
IEやネスケなど特定のブラウザでのみ動作する タグも存在します。
当サイトではこれらの区別を行っていませんのでご注意下さい。
色を指定
HTMLで色を指定するには二通りあります。
色指定値(#rrggbb)方式と、色名で直接指定するやり方があり
いずれも カラーチャートを参照してください。
長さを指定
HTMLで長さを指定するには三通りあります。
整数(単位はピクセル)で指定、パーセント(%)とピクセル(px)で指定
そして フレームなどで使われる割合指定(*)があります。
またこれらはタグによって使えない場合があります。
要素とタグ
タグは通常開始タグと終了タグで内容を挟む形で記述します。
ただし<BR>や<IMG>など「空要素」 といって
開始タグのみで終了タグがないものもあります。
また特に意識しなくてもよいですが、
”論理的”には要素はブロックレベル要素とインラインレベル要素に大別されます。

★ブロックレベル要素(ひとつのまとまりを構成する要素)
ADDRESS, BLOCKQUOTE, CENTER, DIV, FORM, H1~H6, HR,
NOFRAMES, OL, P, PRE, TABLE, UL
★インラインレベル要素(文字と同じレベルで扱われる要素)
A, ACRONYM, B, BIG, BR, BUTTON, CITE, CODE, EM, FONT, I, 
IFRAME, IMG, INPUT, OBJECT, S, SELECT, SMALL, SPAN,
STRONG, SUB, SUP, TEXTAREA, TT, U, VAR

>文の基本

Doctype
省略可能ですが、どのバージョンでHTML文章を作成しているか、文章の冒頭に書かれるタグです。

★通常の場合
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
★フレーム仕様の場合
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN">
文章の構造
通常文章の構造は以下のように定義されます。
<HTML>
<HEAD>
 最初に読み込まれる部分。 文章の情報やスタイルシート、JavaScriptなど。 
</HEAD>
<BODY>
 実際ブラウザに表示される文章の内容。 
</BODY>
</HTML>
文章にタイトル
ブラウザのタイトルバーに表示される部分です。
<TITLE>秋のホームページ</TITLE>
コメント
このタグの間に書かれた部分はブラウザには表示されません。
<!--コメント-->
連絡先を示す
サイト製作者の連絡先を示す場合に使用されます。
ブラウザでは斜体文字で表示されます。
<ADDRESS>秋@管理人</ADDRESS>
文章を自動的にリロード
<META http-equiv="refresh" content="秒数">
※チャットのページ等で利用されています。
他のページに移動
自動的に他のページにとばします。
<META http-equiv="refresh" content="秒数;URL=http://~">
※HP移転のお知らせページでよく使われています。
トランジション指定
ページを移動する時のビジュアル効果を指定します。
<META http-equiv="Site-OUT"
 content="RevealTrans(Duration=2,Transition=23)">
<META http-equiv="Page-Enter"
 content="RevealTrans(Duration=2,Transition=23)">
<META http-equiv="Page-Exit"
 content="RevealTrans(Duration=2,Transition=23)">
※PCによりブラウザが固まる恐れがあります。

>テキスト

見出し文字
▼Sample
<H4>見出し</H4>
▼Display

見出し

※数字は1から6の6段階。1が一番大きい。
段落
▼Sample
<P align="center">段落</P>
▼Display

段落

※属性値alignは行揃えの指定。他にleftとright。
改行
▼Sample
改行<BR>する
▼Display
改行
する
入力通り表示
▼Sample
<PRE>入力した とおりに 表示</PRE>
▼Display
入力した とおりに 表示
※改行などそのまま反映されます。
長い文の引用
▼Sample
<BLOCKQUOTE> HTMLとは( HyperText Markup Language ) の略で、<BR>
タグという手段を使ってPCが情報を読めるようにできる言語です。
</BLOCKQUOTE>
▼Display
HTMLとは( HyperText Markup Language ) の略で、
タグという手段を使ってPCが情報を読めるようにできる言語です。
※<BLOCKQUOTE>タグで上下左右にスペースが空きます。
強調
▼Sample
<EM>強調</EM>
▼Display
強調
※斜体文字になります。
より強い強調
▼Sample
<STRONG>より強い強調</STRONG>
▼Display
より強い強調
※太字になります。
上付き文字
▼Sample
<SUP>上付き</SUP>文字
▼Display
上付き文字
下付き文字
▼Sample
<SUB>下付き</SUB>文字
▼Display
下付き文字
打ち消し線
▼Sample
<DEL>打ち消し線</DEL>
▼Display
打ち消し線
点滅文字
▼Sample
<BLINK>点滅</BLINK>
▼Display
点滅
※IE非対応
スクロール文字
▼Sample
<MARQUEE direction="left" behavior="scroll">スクロール文字</MARQUEE>
▼Display
スクロール文字
※属性directionはスクロールの方向。属性値は他に"right"。
※属性behaviorは動き方。属性値は他に"alternate"と"slide"。
※属性は他にloop。属性値は"回数(整数)"。
※属性は他にscrollmountで再描画までの距離。属性値は"ピクセル"。
※属性は他にwidth、height、bgcolorなど。
※ネスケ非対応

>ページ

背景色の指定
ページの背景色を設定します。
<BODY bgcolor="色">
文章
</BODY>
※色の指定方法はカラーチャートを参照してください。
背景に画像
背景に画像を使う方法です。
<BODY background="URL">
文章
</BODY>
※属性値"URL"は画像ファイル(.gif .jpgなど)。
テキストの色指定
ページ全体の文章の色を指定します。
<BODY text="色" link="色" vlink="色" alink="色">
文章
</BODY>
※属性textは標準のテキスト色指定。
※属性linkはリンク部分の色指定で未クリック。
※属性vlinkはリンク部分の色指定でクリックの瞬間。
※属性alinkはリンク部分の色指定でクリック済み。
色を部分的に指定
▼Sample
<FONT color="red">文字</FONT>
▼Display
文字
行揃えの指定
▼Sample
<DIV align="right">文字</DIV>
▼Display
文字
※属性値は他に"left"と"center"
横罫線
▼Sample
こんな<HR size="3" color="red" width="80%" align="right">かんじ
▼Display
こんな
かんじ
※属性sizeは線の太さ
※属性colorは線の色
※属性widthは線の長さ。属性値は他に"%"
※属性alignは線の位置。属性値は他に"center"と"right"
右クリックを禁止する
▼Sample
<BODY oncontextmenu="return false">
※ソースを見られたくないページで若干の効果があります。
コピペを禁止する
▼Sample
<BODY onselectstart="return false">

>フォント

フォントの大きさ指定
▼Sample
<FONT size="1">フォントの大きさ</FONT>
<FONT size="7">フォントの大きさ</FONT>
▼Display
フォントの大きさ
フォントの大きさ
※属性値は"1"から"7"まで。
フォントの種類を指定
▼Sample
<FONT face="HG正楷書体-PRO">正楷書体</FONT>
▼Display
正楷書体
※属性値は他に"HGP祥南行書体"、"HG丸ゴシックM-PRO"、"Tempus Sans ITC"、"Lucida Handwriting"など多数。詳しくはフォント表示サンプルフォント表示サンプルをご参照ください。
フォントスタイルを指定
▼Sample
<B>太字</B>
<I>斜体</I>
<S>抹消線</S>
<TT>等幅</TT>
<U>下線</U>
<BIG>直前の文字より大きめ</BIG>
<SMALL>直前の文字より小さめ</SMALL>
▼Display
太字
斜体
抹消線
等幅
下線
直前の文字より大きめ
直前の文字より小さめ

>リスト

非序列リスト
▼Sample
<UL type="square">
<LI></LI>
<LI>たばこ</LI>
<LI></LI>
</UL>
▼Display
※マークが付き、項目がインデント(字下げ)されます。
※属性typeでマークの形を指定。属性値は他に"disk"と"circle"。
序列リスト
▼Sample
<OL type="1">
<LI></LI>
<LI>たばこ</LI>
<LI></LI>
</OL>
▼Display
  1. たばこ
※番号が付き、項目がインデント(字下げ)されます。
※属性typeで番号の形を指定。属性値は他に"a"、"A"、"Ⅰ"、"ⅰ"。
定義リストを表示
▼Sample
<DL>
<DT>アルコール飲料</DT>
<DD>一般的に『お酒』といわれ、日本酒やウィスキーなどがある。</DD>
</DL>
▼Display
アルコール飲料
一般的に『お酒』といわれ、日本酒やウィスキーなどがある。
※上下にスペースが空き、改行とインデントがはいります。

>イメージ

画像を表示する
▼Sample
<IMG src="banner02.gif" width="88" height="31" border="0" alt="バナー">
▼Display
バナー
※属性srcの属性値"URL"は画像ファイル(.gif .jpgなど)。 
※属性widthとheightは画像の大きさ指定。属性値は"ピクセル"か"%"。
※属性borderで画像の周りに枠線。属性値は線の太さで"ピクセル"。
※属性altは画像の代わりに表示されるテキスト。

>リンク

リンクを貼る
▼Sample
<A href="index.html" target="_self">HTML</A>
▼Display
HTML
※テキストや画像にリンクを設定します。
※属性targetでリンク先を指定。
※属性値"_self"でリンク元と同じフレームに表示。
※属性値"_top"でフレームもすべて解除して表示。
※属性値"_blank"で新しいウィンドウを開き表示。
※属性値"_parent"で各親フレームに表示。
メール送信リンク
▼Sample
<A href="mailto:aki2nd@yahoo.co.jp">管理人にメール</A>
▼Display
管理人にメール

>フォーム

メール送信フォーム
▼Sample
<FORM action="mailto:aki2nd@yahoo.co.jp"
method="post" enctype="text/plain">
名前<INPUT type="text" size="20" name="Name"><BR>
題名<INPUT type="text" size="20" name="Subject"><BR>
内容<BR>
<TEXTAREA cols="50" rows="5" name="contents"></TEXTAREA><BR>
<INPUT type="submit" value="送信"><INPUT type="reset" value="リセット">
</FORM>
▼Display
名前
題名
内容

※CGIを使わないメール送信フォームです。コピペでお使いください。
※コピペの際には、FORMの属性actionの属性値をご自分のメールアドレスに変更して下さい。

>テーブル

表をつくる
▼Sample
<TABLE width="200" height=""
border="1" bordercolor="red" bgcolor="yellow"
cellSpacing="0" cellpadding="5">

<TR><TH>たばこ</TH><TH>値段</TH></TR>
<TR><TD>マルボロ</TD><TD>280円</TD></TR>
<TR><TD>ラーク</TD><TD>250円</TD></TR>

</TABLE>
▼Display


たばこ値段
マルボロ 280円
ラーク 250円


※表は<TABLE>~</TABLE>内に設定します。
※要素<TR>で横の行を定義。
※要素<TD>でセル内のデータを定義。
※要素<TH>で見出しを定義。セル内で、文字は太字でセンタリングされる。
※<TABLE>内の属性width、heightで表の大きさを指定。
※<TABLE>内の属性borderで枠の太さを指定。
※<TABLE>内の属性bordercolorで枠の色を指定。
※<TABLE>内の属性bgcolorで背景色を設定。
※<TABLE>内の属性cellSpacingでセルとセルの間隔を設定。
※<TABLE>内の属性cellpaddingでセルとセル内の内容との間隔を設定。
テーブルの背景に画像
▼Sample
<TABLE background="bg.gif" border="1" cellpadding="25">
<TR>
<TD>マルボロ</TD>
<TD>280円</TD>
</TR>
</TABLE>
▼Display


マルボロ 280円


※<TABLE>内の属性backgroundで背景画像(URL)を指定。

>その他

音楽を鳴らす
▼Sample
<EMBED src="html.mid" autostart="false" repeat="false"
width="200" height="45">
</EMBED>
▼Display
事情により割愛
※属性srcで音楽ファイルのURLを指定。
※属性autostartでページを開いたとき自動的に再生するかを指定。
 属性値は他に"true"で自動再生。
※属性repeatで繰り返し再生するかどうかを指定。
 属性値は他に"true"で繰り返し再生。
※属性width、heightでプラグインのパネルの大きさを指定。
 属性値は"ピクセル"。
インラインフレーム
▼Sample
<IFRAME name="update" src="URL~"
 frameBorder="1" width="300" height="90" scrolling="yes">
</IFRAME>
▼Display





※属性nameはフレーム名。リンクからのtarget先に使用される。
※属性srcはフレーム内に表示される内容で、属性値は"ページのURL"。
※属性frameBorderはフレームの枠で、属性値"0"で非表示。
※属性width、heightはフレームの幅。属性値は"ピクセル"か"%"。
※属性scrollingはスクロールの指定で、
 属性値"yes"は可能、属性値"no"は不可能、
 属性値"auto"でデフォルト(必要に応じて)。

>カラーチャート

 

色名による指定

ColornameColornameをご参照ください。

 

Web Safeカラー (#rrggbb方式)
#000000 #000033 #000066 #000099 #0000aa #0000cc #0000ff
#003300 #003333 #003366 #003399 #0033aa #0033cc #0033ff
#006600 #006633 #006666 #006699 #0066aa #0066cc #0066ff
#009900 #009933 #009966 #009999 #0099aa #0099cc #0099ff
#00aa00 #00aa33 #00aa66 #00aa99 #00aaaa #00aacc #00aaff
#00cc00 #00cc33 #00cc66 #00cc99 #00ccaa #00cccc #00ccff
#00ff00 #00ff33 #00ff66 #00ff99 #00ffaa #00ffcc #00ffff
#330000 #330033 #330066 #330099 #3300aa #3300cc #3300ff
#333300 #333333 #333366 #333399 #3333aa #3333cc #3333ff
#336600 #336633 #336666 #336699 #3366aa #3366cc #3366ff
#339900 #339933 #339966 #339999 #3399aa #3399cc #3399ff
#33aa00 #33aa33 #33aa66 #33aa99 #33aaaa #33aacc #33aaff
#33cc00 #33cc33 #33cc66 #33cc99 #33ccaa #33cccc #33ccff
#33ff00 #33ff33 #33ff66 #33ff99 #33ffaa #33ffcc #33ffff
#660000 #660033 #660066 #660099 #6600aa #6600cc #6600ff
#663300 #663333 #663366 #663399 #6633aa #6633cc #6633ff
#666600 #666633 #666666 #666699 #6666aa #6666cc #6666ff
#669900 #669933 #669966 #669999 #6699aa #6699cc #6699ff
#66aa00 #66aa33 #66aa66 #66aa99 #66aaaa #66aacc #66aaff
#66cc00 #66cc33 #66cc66 #66cc99 #66ccaa #66cccc #66ccff
#66ff00 #66ff33 #66ff66 #66ff99 #66ffaa #66ffcc #66ffff
#990000 #990033 #990066 #990099 #9900aa #9900cc #9900ff
#993300 #993333 #993366 #993399 #9933aa #9933cc #9933ff
#996600 #996633 #996666 #996699 #9966aa #9966cc #9966ff
#999900 #999933 #999966 #999999 #9999aa #9999cc #9999ff
#99aa00 #99aa33 #99aa66 #99aa99 #99aaaa #99aacc #99aaff
#99cc00 #99cc33 #99cc66 #99cc99 #99ccaa #99cccc #99ccff
#99ff00 #99ff33 #99ff66 #99ff99 #99ffaa #99ffcc #99ffff
#aa0000 #aa0033 #aa0066 #aa0099 #aa00aa #aa00cc #aa00ff
#aa3300 #aa3333 #aa3366 #aa3399 #aa33aa #aa33cc #aa33ff
#aa6600 #aa6633 #aa6666 #aa6699 #aa66aa #aa66cc #aa66ff
#aa9900 #aa9933 #aa9966 #aa9999 #aa99aa #aa99cc #aa99ff
#aaaa00 #aaaa33 #aaaa66 #aaaa99 #aaaaaa #aaaacc #aaaaff
#aacc00 #aacc33 #aacc66 #aacc99 #aaccaa #aacccc #aaccff
#aaff00 #aaff33 #aaff66 #aaff99 #aaffaa #aaffcc #aaffff
#cc0000 #cc0033 #cc0066 #cc0099 #cc00aa #cc00cc #cc00ff
#cc3300 #cc3333 #cc3366 #cc3399 #cc33aa #cc33cc #cc33ff
#cc6600 #cc6633 #cc6666 #cc6699 #cc66aa #cc66cc #cc66ff
#cc9900 #cc9933 #cc9966 #cc9999 #cc99aa #cc99cc #cc99ff
#ccaa00 #ccaa33 #ccaa66 #ccaa99 #ccaaaa #ccaacc #ccaaff
#cccc00 #cccc33 #cccc66 #cccc99 #ccccaa #cccccc #ccccff
#ccff00 #ccff33 #ccff66 #ccff99 #ccffaa #ccffcc #ccffff
#ff0000 #ff0033 #ff0066 #ff0099 #ff00aa #ff00cc #ff00ff
#ff3300 #ff3333 #ff3366 #ff3399 #ff33aa #ff33cc #ff33ff
#ff6600 #ff6633 #ff6666 #ff6699 #ff66aa #ff66cc #ff66ff
#ff9900 #ff9933 #ff9966 #ff9999 #ff99aa #ff99cc #ff99ff
#ffaa00 #ffaa33 #ffaa66 #ffaa99 #ffaaaa #ffaacc #ffaaff
#ffcc00 #ffcc33 #ffcc66 #ffcc99 #ffccaa #ffcccc #ffccff
#ffff00 #ffff33 #ffff66 #ffff99 #ffffaa #ffffcc #ffffff

>フォント表示サンプル

=ご注意=
フォントには沢山の種類が存在しますが、環境によって表示できたり出来なかったりします。 そのためユーザー個々の環境によりご利用できないフォントに関しては、
『MS Pゴシック』で代用表示されています。

serif (明朝体風)
serif ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Batang ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Book Antiqua ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Bookman Old Style ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Century ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Gungsuh ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Garamond ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Georgia ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
PMingLiU ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
MS PMincho ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
MS P明朝 ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Modern ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Roman ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Palatino Linotype ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Times New Roman ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
New York ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Palatino ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Times ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
平成明朝 ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語



sans-serif (ゴシック体風)
sans-serif ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Arial ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Arial Black ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Arial Unicode MS ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Century Gothic ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Comic Sans MS ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Copperplate ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Helvetica ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Impact ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Lucida ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Lucida Sans Unicode ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
MS UI Gothic ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
MS Pゴシック ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
MS PRゴシック ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
News Gothic ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Tahoma ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Trebuchet MS ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Verdana ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Charcoal ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Chicago ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Geneva ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Osaka ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
中ゴシック体 ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
平成角ゴシック ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語



cursive (手書き体風)
cursive ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
HG正楷書体-PRO ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
HGP行書体 ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
HGS行書体 ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Script ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Zapf-Chancery ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語



monospace (等幅フォント)
monospace ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
BatangChe ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Courier ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Courier New ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
GungsuhChe ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
HG行書体 ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Lucida Console ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
MingLiU ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
MS Mincho ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
MS 明朝 ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
MS ゴシック ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
OCRB ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
SimSun ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Monaco ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Osaka-等幅 ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
細明朝体 ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語



fantasy (装飾的なフォント)
fantasy ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Goudy ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語



others (その他)
Symbol ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Webdings ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語
Wingdings ABCDEFGHTJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 あいうえお 日本語

>特殊文字一覧表

タグに用いられている予約文字(&、<、>、"など) やキーボードにない文字を使用する場合、 特殊な記述方法が必要となります。例えば特殊文字を名前で指定する場合は、 &+キーワード+;(セミコロン)という形式で記述します。

予約文字
記号記述方法記号名
< &lt; 小なり
> &gt; 大なり
& &amp; アンパーサンド
" &quot; 引用符
, &#44; コンマ
  &nbsp; スペース
ISO 8859-1
記号記述方法記号名
¡ &#161; &iexcl;
¢ &#162; &cent;
£ &#163; &pound;
¤ &#164; &curren;
\ &#165; &yen;
¦ &#166; &brvbar;
§ &#167; &sect;
¨ &#168; &uml;
© &#169; &copy;
ª &#170; &ordf;
« &#171; &laquo;
¬ &#172; &not;
  &#173; &shy;
® &#174; &reg;
¯ &#175; &macr;
° &#176; &deg;
± &#177; &plusmn;
² &#178; &sup2;
³ &#179; &sup3;
´ &#180; &acute;
µ &#181; &micro;
&#182; &para;
· &#183; &middot;
¸ &#184; &cedil;
¹ &#185; &sup1;
º &#186; &ordm;
» &#187; &raquo;
¼ &#188; &frac14;
½ &#189; &frac12;
¾ &#190; &frac34;
¿ &#191; &iquest;
À &#192; &Agrave;
記号記述方法記号名
Á &#193; &Aacute;
 &#194; &Acirc;
à &#195; &Atilde;
Ä &#196; &Auml;
Å &#197; &Aring;
Æ &#198; &AElig;
Ç &#199; &Ccedil;
È &#200; &Egrave;
É &#201; &Eacute;
Ê &#202; &Ecirc;
Ë &#203; &Euml;
Ì &#204; &Igrave;
Í &#205; &Iacute;
Î &#206; &Icirc;
Ï &#207; &Iuml;
Ð &#208; &ETH;
Ñ &#209; &Ntilde;
Ò &#210; &Ograve;
Ó &#211; &Oacute;
Ô &#212; &Ocirc;
Õ &#213; &Otilde;
Ö &#214; &Ouml;
× &#215; &times;
Ø &#216; &Oslash;
Ù &#217; &Ugrave;
Ú &#218; &Uacute;
Û &#219; &Ucirc;
Ü &#220; &Uuml;
Ý &#221; &Yacute;
Þ &#222; &THORN;
ß &#223; &szlig;
à &#224; &agrave;
記号記述方法記号名
á &#225; &aacute;
â &#226; &acirc;
ã &#227; &atilde;
ä &#228; &auml;
å &#229; &aring;
æ &#230; &aelig;
ç &#231; &ccedil;
è &#232; &egrave;
é &#233; &eacute;
ê &#234; &ecirc;
ë &#235; &euml;
ì &#236; &igrave;
í &#237; &iacute;
î &#238; &icirc;
ï &#239; &iuml;
ð &#240; &eth;
ñ &#241; &ntilde;
ò &#242; &ograve;
ó &#243; &oacute;
ô &#244; &ocirc;
õ &#245; &otilde;
ö &#246; &ouml;
÷ &#247; &divide;
ø &#248; &oslash;
ù &#249; &ugrave;
ú &#250; &uacute;
û &#251; &ucirc;
ü &#252; &uuml;
ý &#253; &yacute;
þ &#254; &thorn;
ÿ &#255; &yuml;
     
その他特殊文字
記号記述方法
&#9824;
&#9827;
&#9829;
&#9830;
&#9834;
&#9835;
&#9839;
&#9794;
&#9792;
&#9788;
&#9787;
&#9786;
記号記述方法
&#9702;
&#9689;
&#9688;
&#9674;
&#9619;
&#9618;
&#9617;
&#9616;
&#9612;
&#9608;
&#9604;
&#9600;
記号記述方法
α &#945;
β &#946;
γ &#947;
δ &#948;
ε &#949;
ζ &#950;
η &#951;
θ &#952;
ι &#953;
κ &#954;
λ &#955;
μ &#956;