文書構造 - html, head, title, meta, body

<html>: HTMLファイル全体を囲むタグ。このタグさえあればHTMLファイルとなります。
<head>: HTMLファイルについての情報を記述します。このタグ内に、以下のtitle, meta や、link, style, script等が記述できます。
<title>: HTMLファイルのタイトルを表します。
<meta>: 文字コードやファイルの作成者など、様々な情報が記述できます。必ずしも記述が必要なわけではありません。以下にいくつか例を挙げておきます。

<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">: 文字コードを記述します。日本語ページではShift_JIS, EUC-JP, ISO-2022-JP, UTF-8が一般的に使用されているようです。文字化けしないためにも、記述しておいた方が良いです。
<meta http-equiv="Content-Style-Type" content="text/css">: スタイルシートを使用する場合は記述しておいた方が良いです。
<meta http-equiv="Content-Script-Type" content="text/javascript">: スクリプトを使用する場合は記述しておいた方が良いです。
<meta name="keywords" content="パソコン,インターネット">: キーワードを指定しておくと、ロボット型の検索エンジンに登録されやすくなる、かも知れません。
<meta name="description" content="パソコンの最新情報を紹介">: ページの説明を記述します。ロボット型の検索エンジンがこの部分を認識してくれる、かも知れません。
<meta name="author" content="太郎">: ページの作成者を記述します。ページ上に表示されるわけではありません。
<meta name="generator" content="notepad">: ページを作成したソフトを記述します。上記の場合、メモ帳です。
<meta http-equiv="Refresh" content="10">: 指定時間毎にページを再読み込みします。上記の場合、10秒毎に自動的に再読み込みされます。

<body>: ページの本文を記述します。

ソース

<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
    <meta http-equiv="Content-Style-Type" content="text/css">
    <meta http-equiv="Content-Script-Type" content="text/javascript">
    <title>ここにタイトル</title>
  </head>

  <body>
    <p>こんにちは</p>
  </body>

</html>

Topへ

見出し - h1, h2, h3, h4, h4, h6

<h1>～<h6>: 見出しを表示します。h1が一番サイズが大きく、順に小さくなっていきます。上下に1行程度の空きができます。

ソース

<h1>見出し１</h1>
<h2>見出し２</h2>
<h3>見出し３</h3>
<h4>見出し４</h4>
<h4>見出し５</h4>
<h6>見出し６</h6>

実際の表示

見出し１

見出し２

見出し３

見出し４

見出し５

見出し６

Topへ

段落 - p

<p>: 段落を表します。上下に1行程度の空きができます。

ソース

<p>段落１です。隙間のない文章は読みづらくなるので、適当なところで段落で区切ると読みやすくなります。</p>
<p>段落２です。上の段落との間に隙間があると思います。<br>を連続入力して隙間を空けるのは望ましくないようです。</p>

実際の表示

段落１です。隙間のない文章は読みづらくなるので、適当なところで段落で区切ると読みやすくなります。

段落２です。上の段落との間に隙間があると思います。<br>を連続入力して隙間を空けるのは望ましくないようです。

改行 - br

<br>: ページ内の任意の場所で改行できます。

ソース

ページ内の任意の場所<br>で改行できます。

実際の表示

ページ内の任意の場所
で改行できます。

Topへ

リンク - a, link, base

<a>: リンクを指定します。囲まれた文字列をクリックすると、別のページへ飛んだり、ページ内の指定の場所へ飛ぶことができます。メールアドレスを指定すれば、そのアドレス宛のメール作成画面が出ます。

ソース

<a href="http://www.google.co.jp">Google</a>

実際の表示

Google

<link>: HTMLファイルと別の文書ファイルをリンクさせます。 <a>とは違い、<head>内に記述します。スタイルシートをhtmlファイルとは別に作成している場合、このタグで指定して読み込ませます。

ソース

<head>
  <link rel="stylesheet" href="style.css" type="text/css">
</head>

<base>: <a>や<img>のリンク先を相対パスで指定している場合、基準となるのはHTMLファイルがある場所ですが、このタグでその基準場所を変えることができます。href属性で基準を設定します。またtarget属性によって、リンクをどのウィンドウで開くか一括で指定できます。このタグは<head>内に記述します。

ソース

<head>
  <base href="http://www.xxx.com/" target="_blank">
</head>

Topへ

グループ化 - div, span

<div> <span>: div, span 共にそれ自体に意味はありません。囲まれた部分の位置を指定したり、スタイルシートの設定を適用させたりします。

ソース

spanは文章の途中で<span style="color:red;">スタイルの変更</span>ができます。
<div style="background-color:#bfb;">ここからdiv領域。<br>上下に改行が入ります。<br>
いくつかの要素をまとめて移動したり、スタイルの変更ができます。</div>
<span style="color:red;">span</span>には上下に改行が入りません。

実際の表示

spanは文章の途中でスタイルの変更ができます。

ここからdiv領域。
上下に改行が入ります。
いくつかの要素をまとめて移動したり、スタイルの変更ができます。

spanには上下に改行が入りません。

Topへ

マルチメディア - img, object, param, map, area

<img>: 画像を表示します。alt属性に画像の説明を記述します。また、レイアウトを崩さないために、幅と高さを指定しておくと良いです。

ソース

<img src="sample.jpg" alt="サンプル画像" width="100" height="100">

実際の表示

<object> <param>: 画像、動画、音声などのデータを表示します。ブラウザによっては表示できない可能性もあるようです。paramタグでデータの種類などを指定します。Youtubeの動画をページ内に貼り付ける際、これらのタグが使われています。

ソース

<object data="http://www.youtube.com/v/JfGOlEizUUs&hl=ja_JP&fs=1&" type="application/x-shockwave-flash" width="425" height="350">
  <param name="movie" value="http://www.youtube.com/v/JfGOlEizUUs&hl=ja_JP&fs=1&">
  <param name="wmode" value="transparent">
</object>

実際の表示

<map> <area>

画像内に領域を作ってリンクの設定ができます。<map>でマップの名前を設定し、<area>で領域とリンク先を設定します。また、<img>にusemap属性でマップの名前を指定します。以下、基本的な設定方法です。

形	shape属性	coords属性
四角形	rect	左上のx座標, 左上のy座標, 右下のx座標, 右下のy座標
円	circle	円の中心のx座標, 円の中心のy座標, 円の半径
多角形	poly	各頂点のx座標, 各頂点のy座標を順番に記述

ソース

<img src="map.jpg" usemap="#smap" alt="サンプルマップ" width="160" height="100">
<map name="smap">
  <area href="xxx.htm" shape="rect" alt="四角形" coords="59,13,104,50">
  <area href="xxx.htm" shape="circle" alt="円形" coords="135,35,12">
  <area href="xxx.htm" shape="poly" alt="三角形" coords="39,64,103,92,103,64">
</map>

実際の表示

Topへ

フレーズ - em, strong, dfn, code, samp, kbd, var, cite, abbr, acronym

文中の言葉への意味づけを行うタグです。これらのタグによる見た目の変化はブラウザによって異なります。また、ブラウザによっては何の変化も起きない可能性もあります。

<em>: 文字列を強調します。一般的に斜体になります。

ソース

文字列を<em>強調</em>します。

実際の表示

文字列を強調します。

<strong>: 文字列をさらに強調します。<em>よりさらに強調したい部分に使用します。一般的に太字になります。

ソース

文字列を<strong>強調</strong>します。

実際の表示

文字列を強調します。

<dfn>: 囲まれた用語が定義を行っているものであることを示します。ページ内で最初にその用語を説明する際に使用します。一般的に斜体で表示されます。

ソース

<dfn>RSS</dfn>という語は、規格によって名称が異なり・・・

実際の表示

RSSという語は、規格によって名称が異なり・・・

<code>: プログラムのソースコードであることを示します。一般的に等幅フォントで表示されます。

ソース

<code>var str = "こんにちは";<br>alert(str);</code>

実際の表示

var str = "こんにちは";
alert(str);

<samp>: プログラムの出力サンプルであることを示します。一般的に等幅フォント表示されます。

ソース

<samp>再起動しますか？</samp>というメッセージ画面が出たら・・・

実際の表示

再起動しますか？というメッセージ画面が出たら・・・

<kbd>: キーボードなどでユーザから入力される文字であることを示します。
一般的に等幅フォントで表示されます。

ソース

フリーズした時は<kbd>Ctrl + Alt + Delete</kbd>を押して・・・

実際の表示

フリーズした時はCtrl + Alt + Deleteを押して・・・

<var>: プログラムの変数または引数であることを示します。一般的に斜体で表示されます。

ソース

変数<var>xyz</var>に数値を代入して・・・

実際の表示

変数xyzに数値を代入して・・・

<cite>: 引用か、他の文書やサイトへの参照であることを示します。一般的に斜体で表示されます。

ソース

詳しくは<cite>W3C</cite>に確認してください

実際の表示

詳しくはW3Cに確認してください

<abbr>: 省略形であることを示します。例えば、HTML、XML等。
一般的にマウスカーソルを文字列に合わせると、title属性に記述した内容が表示されます。

ソース

<abbr title="Hypertext Markup Language">HTML</abbr>によってインターネットは・・・

実際の表示

HTMLによってインターネットは・・・

<acronym>: 頭文字をとって省略した語であることを示します。例えば、LAN、SOHO等。
一般的にマウスカーソルを文字列に合わせると、title属性に記述した内容が表示されます。

ソース

無線<acronym title="Local Area Network">LAN</acronym>によってネット社会は・・・

実際の表示

無線LANによってネット社会は・・・

Topへ

引用 - blockquote, q

<blockquote> <q>: どちらも引用文であることを示します。<blockquote>は長い引用、<q>は段落の区切りを必要としないような短い引用を示します。一般的に<blockquote>の周囲には隙間ができ、<q>の部分は引用符（"）やかぎ括弧（「」）で囲われます。

ソース

孔子曰く、<blockquote><p class="sample">吾、15にして学に志し、30にして立ち、40にして惑わず、50にして天命を知る。60にして・・・</p></blockquote>だそうです。<p>ナポレオン曰く、<q>余の辞書に不可能の文字はない</q>、だそうです。</p>

実際の表示

孔子曰く、

吾、15にして学に志し、30にして立ち、40にして惑わず、50にして天命を知る。60にして・・・

だそうです。

ナポレオン曰く、余の辞書に不可能の文字はない、だそうです。

Topへ

上付き、下付き - sub, sup

<sub> <sup>: <sub>は文字を下付きに、<sup>は上付きにします。

ソース

CO<sub>2</sub>削減<br>
37万km<sup>2</sup>

ソース

CO₂削減
37万km²

Topへ

アドレス - address

<address>: ページの問い合わせ先を示します。一般的に斜体で表示されます。

ソース

<address>問い合わせ先：
<a href="mailto:xxx@yyy.zzz">xxx@yyy.zzz</a></address>

実際の表示

問い合わせ先：xxx@yyy.zzz

Topへ

整形済テキスト - pre

<pre>: このタグで囲まれた部分はソースの記述通りに表示されます。
通常、ソース内の改行や連続した半角スペース等はブラウザ上で表示されませんが、<pre>内の文字列はそのまま表示されます。

ソース

<pre>
あいうえお
  かきくけこ
    さしすせそ
      たちつてと
</pre>

実際の表示

あいうえお
  かきくけこ
    さしすせそ
      たちつてと

Topへ

変更の目印 - ins, del

<ins>: どちらも文章の変更点を明示するタグです。
ins は挿入、del は削除を表します。
一般的に、<ins>は下線、<del> は打ち消し線が表示されます。

ソース

参加者は<del>100名</del><ins>150名</ins>です。

実際の表示

参加者は~~100名~~150名です。

Topへ

リスト - ul, ol, li, dl, dt, dd

<ul> <ol> <li>: リストを表示します。<ul>は順不同のリスト、<ol>は順序付きリストです。それぞれ、中に<li>で項目を列挙していきます。タグを入れ子にして、複雑なリストも作れます。

ソース

<b>順不同リスト</b>
<ul>
  <li>項目1</li>
  <li>項目2</li>
  <li>項目3</li>
</ul>

<b>順序付きリスト</b>
<ol>
  <li>項目1</li>
  <li>項目2</li>
  <li>項目3</li>
</ol>

<b>入れ子リスト</b>
<ul>
  <li>項目1
    <ul>
      <li>項目1-1</li>
      <li>項目1-2</li>
    </ul>
  </li>
  <li>項目2
    <ul>
      <li>項目2-1</li>
      <li>項目2-2
        <ul>
          <li>項目2-2-1</li>
          <li>項目2-2-2</li>
        </ul>
      </li>
      <li>項目2-3</li>
    </ul>
  </li>
</ul>

実際の表示

順不同リスト

項目1
項目2
項目3

順序付きリスト

項目1
項目2
項目3

入れ子リスト

項目1
- 項目1-1
- 項目1-2
項目2
- 項目2-1
- 項目2-2
  - 項目2-2-1
  - 項目2-2-2
- 項目2-3

<dl> <dt> <dd>: 説明付きのリストを表示します。<dl>内に<dt>と<dd>を入れます。<dt>には単語、<dd>にはその説明文を記述します。<dt>は字下げされます。

ソース

<dl>
  <dt>KY</dt>
  <dd>空気が読めないの略。</dd>
  <dt>JK</dt>
  <dd>女子高生の略。</dd>
</dl>

実際の表示

KY: 空気が読めないの略。
JK: 女子高生の略。

Topへ

フレーム - frameset, frame, noframes, iframe

<frameset> <frame> <noframes>

ウィンドウをフレームで区切り、複数のページを表示することができます。

<frameset>で分割方法を指定し、<frame>で表示するページを指定します。<frameset>のrows属性で横分割、cols属性で縦分割できます。下記サンプルでは<frameset>を入れ子にして、縦と横の分割を組み合わせています。サンプルの rows="150,*" は横分割で、上の部分は150px、下は自動調整を意味します。

<frame>に name="" で名前を付け、<a>のtarget属性でその名前を指定すると、そのフレーム内にリンク先を表示させることができます。

<noframes>を記述しておくと、フレームに対応していないブラウザの場合、<noframes>内の文字列が表示されます。

ソース

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"
 "http://www.w3.org/TR/html4/frameset.dtd">
<html>
  <head>
    <title>フレームのサンプル</title>
  </head>

  <frameset rows="150,*" frameborder="1">
    <frame name="head" src="head.htm">
    <frameset cols="200,*" frameborder="1">
      <frame name="side" src="side.htm">
      <frame name="main" src="main.htm">
    </frameset>
    <noframes>
      <p>フレーム対応のブラウザでご覧ください。</p>
    </noframes>
  </frameset>
</html>

実際の表示はこちら（別ウィンドウで開きます）。

<iframe>: フレームのようにウィンドウ全体を分割するのではなく、ページ内にフレーム領域を作り、別ページを表示します。<iframe>内にテキストを入力しておくと、フレーム非対応のブラウザ向けにメッセージが表示できます。

ソース

<iframe src="./iframe.htm" name="sample" width="400" height="100">
  この部分はインラインフレームを使用しています。
</iframe>

実際の表示

Topへ

スクリプト - script, noscript

<script>: このタグ内にスクリプトを記述します。<script>は<head>内でも<body>内でも記述できます。
また、下記ソースのように、スクリプトの内容を  で囲みます。そうしないと、スクリプトに対応していないブラウザの場合、alert("Hello!"); という内容がそのまま表示されてしまいます。

ソース

<head>
  <script type="text/javascript">
  <!--
    alert("Hello!");
  -->
  </script>
</head>

Topへ

スタイル - style

<style>: このタグ内にスタイルシートを記述します。<style>は必ず<head>内に入れます。
また、下記ソースのように、スタイルシートの内容を  で囲みます。そうしないと、スタイルシートに対応していないブラウザの場合、p { text-align: center; } という内容がそのまま表示されてしまいます。

ソース

<head>
  <style type="text/css">
  <!--
    p { text-align: center; }
  -->
  </style>
</head>

Topへ

表 - table, caption, thead, tfoot, tbody, colgroup, col, tr, th, td

<table> <caption> <tr> <th> <td>

表を作成します。

<table>の中に<tr>を入れ、<tr>の中に<th>や<td>を入れます。<tr>は行の始まり、<th>は表の中の見出し、<td>は項目の始まりを表します。表にタイトルをつける場合は、<table>の直後に<caption>で指定します。

<table>にborder属性を数値で指定すると、その太さの枠線が表示されます。スタイルシートでも枠線は設定できます。

項目を複数つなげたい場合、<td>のrowspan属性、colspan属性でつなげられます。rowspanは縦方向、colspanは横方向で、指定した数だけつなぎます。

ソース

<table border="1">
  <caption>表のタイトル</caption>
  <tr>
    <th>見出し1</th>
    <th>見出し2</th>
    <th>見出し3</th>
  </tr>
  <tr>
    <td>項目1</td>
    <td colspan="2">項目2と3</td>
  </tr>
  <tr>
    <td rowspan="2">項目4と7</td>
    <td>項目5</td>
    <td>項目6</td>
  </tr>
  <tr>
    <td>項目8</td>
    <td>項目9</td>
  </tr>
</table>

実際の表示

表のタイトル
見出し1	見出し2	見出し3
項目1	項目2と3
項目4と7	項目5	項目6
項目4と7	項目8	項目9

Topへ

フォーム - form, input, button, select, optgroup, option, textarea, isindex, label, fieldset, legend

<form>: 入力フォームを表示します。このタグ中にボタンやテキストボックス等の部品を記述します。入力されたデータはaction属性で指定されたURIへ送信されます。通常、送り先はCGIプログラムです。

ソース

<form action="xxx.cgi">
  <div>名前：<input type="text"></div>
  <input type="submit" value="送信"><input type="reset">
</form>

実際の表示

<input>: フォームの部品を表示します。type属性値によって様々な部品を作れます。

type="text": 1行のテキストボックスを表示します。複数行入力させたい場合は、<textarea>を使用します。
type="password": パスワードの入力ボックスを表示します。入力したテキストが伏字になります。
type="checkbox": チェックボックスを表示します。あらかじめチェックを付けておきたい場合、checked属性を記述します。
type="radio": ラジオボタンを表示します。複数の項目から一つしか選択できません。項目をグループ化するには、name属性を統一しておきます。チェックボックス同様、checked属性であらかじめチェックを付けられます。
type="file": ファイル選択のボックスを表示します。ファイル名の入力欄と[参照]ボタンが表示されます。
type="hidden": 隠しデータをサーバーに送信する際に使用します。画面上には表示されません。value属性にこっそり記述しておきます。
type="submit": 送信ボタンを表示します。
type="reset": リセットボタンを表示します。このボタンを押すと、同じフォーム内に入力した内容がすべてリセットされます。
type="button": 汎用ボタンを表示します。
type="image": 画像のボタンを表示します。src属性で画像を指定します。<img>同様、alt属性が必須です。

ソース

<form action="xxx.cgi">
  <div>テキストボックス：
   <input type="text"></div>
  <div>パスワード：
   <input type="password"></div>
  <div>チェックボックス：
   <input type="checkbox" name="chk" value="a">チェックＡ
   <input type="checkbox" name="chk" value="b">チェックＢ
   <input type="checkbox" name="chk" value="c" checked>チェックＣ</div>
  <div>ラジオボタン：
   <input type="radio" name="ra" checked>Ａ
   <input type="radio" name="ra">Ｂ</div>
  <div>ファイル選択：
   <input type="file"></div>
  <div>隠しデータ
   <input type="hidden"></div>
  <div>
    <input type="submit" value="送信">
    <input type="reset">
    <input type="button" value="汎用ボタン" onclick="alert('OK');">
    <input type="image" src="button.jpg" alt="画像ボタン">
  </div>
</form>

実際の表示

<button>: ボタンを表示します。 <input>で作成するボタンとの違いは、ボタン内にHTMLを記述できる点です。そのため、画像を表示させることもできます。

ソース

<button>
  <b style="color:red;">ク</b>
  <span style="color:blue;">リ</span>
  <span style="color:green;">ッ</span>
  <span style="color:purple;">ク</span>
</button>

実際の表示

<select> <optgroup> <option>: 選択ボックスを表示します。<select>の中に、<option>で項目を記述していきます。<optgroup>で項目をグループ化できます。また、<select>にsize属性を設定すると、あらかじめ見えている項目を増やせます。

ソース

<form>
<div>
<select name="location1">
  <optgroup label="北海道">
    <option>北海道</option>
  </optgroup>
  <optgroup label="四国地方">
    <option>香川県</option>
    <option>高知県</option>
    <option>愛媛県</option>
    <option>徳島県</option>
 </optgroup>
</select>
<select name="location2" size="3">
  <option>大阪府</option>
  <option>兵庫県</option>
  <option>京都府</option>
  <option>滋賀県</option>
  <option>奈良県</option>
  <option>和歌山県</option>
</select>
</div>
</form>

実際の表示

<textarea>: 複数行の入力エリアが表示されます。rows属性とcols属性でエリアのサイズを指定します。rowsが高さ、colsが幅です。

ソース

<form>
  <div>
    <textarea rows="5" cols="30">ここに記入して下さい。</textarea>
  </div>
</form>

実際の表示

<isindex>: 1行のテキストボックスを表示します。テキスト入力後にENTERキーを押すと、action属性のURIへテキストを送信します。ただし、現在は死語のようで、W3Cも<input>を使用するように勧めています。

ソース

<isindex prompt="検索キーワード" action="xxx.cgi">

実際の表示

<label>

フォームの部品とラベルを関連付けます。そうすると、ラベル部分をクリックすることでもチェックを入れたりできます。

記述方法は2種類あります。

<label>の中に部品とラベルを入れる。
部品にIDを付け、ラベルのfor属性でそのIDを指定する。

前者はInternet Explorer5や6では非対応です。

ソース

<form>
<p>1の方法：
  <label><input type="radio" name="sex1">男</label>
  <label><input type="radio" name="sex1">女</label>
</p>
<p>2の方法：
  <input id="man" type="radio" name="sex2"><label for="man">男</label>
  <input id="woman" type="radio" name="sex2"><label for="woman">女</label>
</p>
</form>

実際の表示

<fieldset> <legend>: <fieldset>はフォームの部品をグループ化し、<legend>でグループにタイトルをつけます。

ソース

<form>
  <fieldset>
    <div>
      <legend>趣味</legend>
      <input type="checkbox" name="hobby" value="car">車
      <input type="checkbox" name="hobby" value="pc">パソコン
      <input type="checkbox" name="hobby" value="msc">音楽
    </div>
  </fieldset>
</form>

実際の表示

Topへ

文字スタイル - tt, i, b, big, small

文字の見た目を変えるタグ類です。しかし、見た目はスタイルシートで設定すべき、という流れになっているので、使用頻度は低そうです。

<tt>: 文字列の幅を均等にします。
<i>: 文字列を斜体にします。
<b>: 文字列を太字にします。
<big>: 文字列をひとまわり大きくします。
<small>: 文字列をひとまわり小さくします。

ソース

<tt>これは等幅</tt><br>
<i>これは斜体</i><br>
<b>これは太字</b><br>
<big>ひとまわり大きく</big><br>
<small>ひとまわり小さく</small>

実際の表示

これは等幅
これは斜体
これは太字
ひとまわり大きく
ひとまわり小さく

Topへ

罫線 - hr

<hr>: 水平線を表示します。

ソース

水平線↓<hr>

実際の表示

水平線↓

Topへ

テキスト方向 - bdo

<hr>: テキストの方向を指定します。dir属性を"ltr"とすると右方向、"rtl"で左方向となります。

ソース

<bdo dir="ltr">こんばんわ</bdo><br>
<bdo dir="rtl">こんばんわ</bdo>

実際の表示

こんばんわ
こんばんわ

Topへ

HTML Elements

文書構造 - html, head, title, meta, body

ソース

見出し - h1, h2, h3, h4, h4, h6

ソース

実際の表示

見出し１

見出し２

見出し３

見出し４

見出し５

見出し６

段落 - p

ソース

実際の表示

改行 - br

ソース

実際の表示

リンク - a, link, base

ソース

実際の表示

ソース

ソース

グループ化 - div, span

ソース

実際の表示

マルチメディア - img, object, param, map, area

ソース

実際の表示

ソース

実際の表示

ソース

実際の表示

フレーズ - em, strong, dfn, code, samp, kbd, var, cite, abbr, acronym

ソース

実際の表示

ソース

実際の表示

ソース

実際の表示

ソース

実際の表示

ソース

実際の表示

ソース

実際の表示

ソース

実際の表示

ソース

実際の表示

ソース

実際の表示

ソース

実際の表示

引用 - blockquote, q

ソース

実際の表示

上付き、下付き - sub, sup

ソース

ソース

アドレス - address

ソース

実際の表示

整形済テキスト - pre

ソース

実際の表示

変更の目印 - ins, del

ソース

実際の表示

リスト - ul, ol, li, dl, dt, dd

ソース

実際の表示

ソース

実際の表示

フレーム - frameset, frame, noframes, iframe

ソース

ソース

実際の表示

スクリプト - script, noscript

ソース