XHTML1.1 要素一覧

要素の親子関係や属性についてはXHTML1.1 要素詳細一覧をご覧ください。

文章を記述するための要素

あ行

アドレス

<address> block-level

文書の案内や問い合わせ先を表す。作者名、メールアドレス、更新日などを書くのが一般的。

<address>やまだたろう, めいどさんやとい隊主任 Last updated $Date: 2003/02/15 22:38:03 $ GMT</address>

アンカー

<a> Anchor inline

href属性を使ってリンクの始点、あるいはid属性を使って終点をつくる。

<a href="http://www.w3.org/Consortium/Translation/Japanese">仕様書などの日本語訳リンク集</a>

イメージマップ

<map> inline

イメージマップ(クリッカブルマップ)のリンク先を設定する。

<p><object data="hoge.png" type="image/png" usemap="map1"> <map id="map1"> <p>このサイトの構成: <a href="guide.html" shape="rect" coords="0,0,118,28">案内</a> | <a href="shortcut.html" shape="rect" coords="118,0,184,28">直行</a> | <a href="search.html" shape="circle" coords="184,200,60">検索</a> | <a href="top10.html" shape="poly" coords="276,0,276,28,100,200,50,50,276,0">トップ10</a> </p> </map> </object></p>

引用 [いんよう]

<blockquote> block-level

引用した文章であることを表す。ブロックレベル要素。cite属性で引用元のURIを示す。多くのブラウザのデフォルトスタイルでは左右に空きができるが、インデントのための要素ではない。

<blockquote cite="http://www.kanzaki.com/docs/link-view.html"> <p>他のサイトにリンクを張る前に許可を求めなければならないという理由はない</p> </blockquote>

<q> Quotation inline

引用した語句であることを表す。インライン要素。cite属性で引用元のURIを示す。対応ブラウザはq要素の前後に引用符を付け加えて表示するはずだ。

上つき文字 [うえつきもじ]

<sup> SUPerscript inline

上つき文字。

E = mc<sup>2</sup>

HTML要素 [えいちてぃーえむえるようそ]

<html>

HTML文書の一番大元となる要素。

エリア

<area>

クライアント側イメージマップの領域を定義する。map要素の中で使う。要素の内容を持たない。

大きな字 [おおきなじ]

<big> inline

文字を大きくする。なぜ字を大きくしたいか考え、他の要素とCSSを組み合わせて実現した方がよい。

オブジェクト

<object> inline

画像、動画、音声、プログラムなどを埋め込む。

<p> <object data="hoge.mov" type="video/quicktime" height="196" width="240"> <object data="hoge.png" type="image/png"> <object data="hoge.jpg" type="image/jpeg"> ほげほげ。 </object> </object> </object> </p>

上の例では、WEBブラウザが表示できれば hoge.movというクイックタイムムービーを、できなければ hoge.png というPNG静止画を、PNG も表示できなければ JPEG画像 hoge.jpg を、それも表示できなければ文字列「ほげほげ。」を埋め込み表示する。

か行

箇条書き [かじょうがき]

→順不同リスト

頭字語 [かしらじご]

<acronym> inline

日本人にとってはabbr要素との使い分けが今ひとつわかりにくいが、とりあえず一般的な要素であるabbrを使っておけば問題ないようだ。

参考:abbr要素とacronym要素の使い分け

頭文字 [かしらもじ]

→頭字語

画像 [がぞう]

<img> embedded IMaGe inline

文書に画像をはりつける。要素の内容を持たない。alt属性は省略不可。これには画像が表示されない時の代わりの文字を書き、画像の説明にはtitle要素を使う。

<p><img src="cat.jpg" alt="うちの猫" title="ひなまつりのときの写真です。" /></p>

キーボード操作 [きーぼーどそうさ]

<kbd> KeyBoarD inline

コンピュータを操作するときのキーボードから入力される文字を表す。

行 [ぎょう]

<tr> Table Row

表のセル一行分を表す。

強制改行 [きょうせいかいぎょう]

<br> forced line BReak inline

強制的に改行する。要素の内容を持たない。

<p> 「ありがとう」<br /> 「どういたしまして」 </p>

強調 [きょうちょう]

<em> EMphasis inline

強調を表す。

em要素よりも強い強調を表す。

<p>HTMLはレイアウトのための言語では<em>ありません</em>し、ましてやタグは<strong>命令ではありません</strong>。</p>

罫線 [けいせん]

→水平罫線

表の罫線は CSS で制御する。

コード

<code> inline

プログラムなどのコードであることを表す。

<p>そういうときは <code>rm -Rf ./*</code> でオッケー。</p>

さ行

削除 [さくじょ]

<del> DELeted text

いったん公開した後で、変更のため削除された部分を表す。インライン要素としてもブロックレベル要素としても使えるが、インライン要素として記述しているときにブロックレベルの内容を含めることはできない。

<p>例の作品、<del>もう9割方完成してます</del><ins>ごめんなさい、まだ全然できてません</ins>。</p>

下つき文字 [したつきもじ]

<sub> SUBscript inline

下つき文字。

H<sub>2</sub>O

斜体 [しゃたい]

<i> Italic text style inline

文字を斜体にする。なぜ字を斜体にしたいか考え、他の要素とCSSを組み合わせて実現した方がよい。

出典 [しゅってん]

<cite> inline

引用などの出典を明示する。

<blockquote><p>貧乏人は麦を食え。</p></blockquote> <p><cite>池田勇人蔵相 1950年12月国会答弁</cite></p>

出力例 [しゅつりょくれい]

<samp> SAMPle inline

プログラムなどの出力例を表す。

<p>このプログラムを実行すると <samp>Hello! world.</samp> と表示されます。</p>

順不同リスト [じゅんふどうりすと]

<ul> Unordered List block-level

箇条書きのリストを作る。項目の頭に番号がつかないこと以外はol要素と同じ。

<ul> <li>シベリアンハスキー</li> <li>ゴールデンリトリバー</li> <li>柴犬</li> </ul>

省略形 [しょうりゃくけい]

→省略語

省略語 [しょうりゃくご]

<abbr> ABBReviated form inline

title属性を使って省略してないフルスペルの語を説明する。

<abbr title="あけましておめでとうございます">あけおめ</abbr>

書字方向の上書き [しょじほうこうのうわがき]

<bdo> Bi-Directionary Overridge inline

Unicodeでは文字に書字方向情報が含まれているが、これを変更したいとき、dir属性を使って上書きする。

序列リスト [じょれつりすと]

→番号つきリスト

水平罫線 [すいへいけいせん]

<hr> Horizontal Rule block-level

区切りのための線を引く。要素の内容を持たない。

<p>かくして一行は難を逃れたのであった。</p> <hr /> <p>さて、これで収まらないのが裏柳生の総帥、烈堂である。</p>

スクリプト

HTML文書にスクリプトを組み込む。要素の内容がスクリプトになるが、いろいろ制約があるので外部ファイルにして読み込むようにする方がよい。スクリプトはJavaScriptとは限らない。そのため type属性でMIMEタイプを指定して使うスクリプトが何かを明示する必要がある。またスクリプトを使うにはhead要素内でmeta要素を使いデフォルトのスクリプトを宣言する必要がある。

<head> <title>スクリプトがある文書</title> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <script type="text/javascript" src="../hoge.js"></script> </head>

スタイルの指定 [すたいるのしてい]

<style>

HTML文書内でスタイルの指定をする。head要素内で使う。記述に制限があるため、独立したファイルにして link要素で読み込ませる方がよい。

整形済みテキスト [せいけいずみてきすと]

<pre> PREformatted text block-level

HTMLでは連続した空白は無視され、改行は空白と同じものとして扱われるが、pre要素内ではそのまま扱われる。詩の表記やメールの引用などの目的で使われる。また画面の端で折り返し表示されず改行コードがでてくるまで一行で表示されることが期待できるので、行の途中で折り返されては困る、プログラムコードの表示などに使われることも多い。

<blockquote><pre><code> @> setenv DISPLAY localhost:0 @> setenv DYLD_LIBRARY_PATH /Applications/OOo/program:/usr/X11R6/lib @> cd /Applications/OOo/program/ @> sh sof </code></pre></blockquote>

説明 [せつめい]

<dd> Definition Description

定義リストの見出し語と説明のペアのうち、説明の方。

セル

<td> Table Data cell

表のセルを表す。セルの中身が空でもよい。

挿入 [そうにゅう]

<ins> INSerted text

いったん公開した後で、変更のため追加された部分を表す。インライン要素としてもブロックレベル要素としても使えるが、インライン要素として記述しているときにブロックレベルの内容を含めることはできない。

<p>例の作品、<del>かなり遅れそうです</del><ins>実はもうできてるんです</ins>。</p>

た行

タイトル

<title>

文書のタイトルを表す。head要素内に書く。HTML文書にはこの要素が必ず1つ存在しないといけない。

代替内容 [だいたいないよう]

スクリプトが実行されない場合の代替内容を記述する。例えば JavaScriptでメニューを出力している場合など、(セキュリティ対策などで)JavaScriptを無効にしているブラウザでは先のページに進めなくなることがある。そのようなことがないようにnoscript要素を使って代替メニューを記述すべし。

<script type="text/javascript" charset="Shift_JIS" src="menu.js"></script> <noscript> <ul> <li><a href="hoge01.html">ほげ1号</a></li> <li><a href="hoge02.html">ほげ2号</a></li> <li><a href="hoge03.html">ほげ3号</a></li> </ul> </noscript>

段落 [だんらく]

<p> Paragraph block-level

一つの段落を表す。

<p>文章はウインドウの幅で折り返し表示されます。br要素(強制改行)で文章を細切れにすると見づらい表示になることが多々あります。</p> <p>たいがいの場合は、ひとまとまりの文章をpタグで囲むだけで十分です。</p>

小さい字 [ちいさいじ]

<small> inline

文字を小さくする。なぜ字を小さくしたいか考え、他の要素とCSSを組み合わせて実現した方がよい。

定義箇所 [ていぎかしょ]

<dfn> instance DeFiNition inline

重要な語句が初めて出てきた部分など、定義を表す。id属性でIDを振っておけばほかの個所から参照できるようになる。

<p>そのとき現れた謎の覆面男を、<dfn id="lovefighter">愛の戦士</dfn>と呼ぶことにします。</p>

定義リスト [ていぎりすと]

<dl> Definition List block-level

「見出し語(dt)」と「説明」からなるリストを作る。

<dl> <dt>きつねうどん</dt> <dd>油揚げをのせたうどん。ちなみにきつねそばというのは存在しない。</dd> </dl>

等幅 [とうふく]

<tt> TeleType inline

文字を等幅フォントにする。なぜ字を等幅にしたいか考え、他の要素とCSSを組み合わせて実現した方がよい。

は行

パラメータ

<param> PARAMeter

object要素でプログラムを呼び出す場合にパラメータを渡すのに使う。

<p> <object classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" width="160" height="144" codebase="http://www.apple.com/qtactivex/qtplugin.cab"> <param name="SRC" value="hoge.mov" /> <param name="AUTOPLAY" value="true" /> <param name="CONTROLLER" value="false" /> <object data="hoge.mov" type="video/quicktime" height="160" width="144"> 踊って歌うよ。 </object> </object> </p>

番号つきリスト [ばんごうつきりすと]

<ol> Ordered List block-level

箇条書きのリストを作る。項目の頭に番号がつくこと以外はul要素と同じ。

<ol> <li>ねこみみめいど</li> <li>バニー</li> <li>巫女さん</li> </ol>

汎用インライン要素 [はんよういんらいんようそ]

<span> inline

id属性やclass属性を併用することで文書に構造を付け加える。

<h2>ケーキを買いにいった <span class="date">3月3日(月)</span></h2> <p>去年はすっかり忘れててえらい目にあったので、今年はきっちり買いに行った。</p>

汎用ブロック [はんようぶろっく]

<div> DIVision block-level

id属性やclass属性を併用することで文書に構造を付け加える。(複数のブロックレベル要素をひとまとめにするなど)

<div class="section"> <h2>第2章</h2> <p>まず最初に…</p> <p>それから次に…</p> </div>

表 [ひょう]

<table> block-level

表を作る。レイアウトに使うのは間違い。

<table summary="会員名簿"> <tbody> <tr> <td>ぶー</td> <td>長男</td> </tr> <tr> <td>ふー</td> <td>次男</td> </tr> <tr> <td>うー</td> <td>三男</td> </tr> </tbody> </table>

表題 [ひょうだい]

表のタイトル・説明。table要素の開始タグ直後で使う。

<table summary="時間割"> <caption>3年3組時間割</caption> <tbody> <tr> <td></td><td>月</td><td>火</td><td>水</td><td>木</td><td>金</td> </tr> <tr> <td>1</td><td>国</td><td>算</td><td>社</td><td>理</td><td>算</td> </tr> (後略)

表のコマ [ひょうのこま]

→セル

表フッタ [ひょうふった]

<tfoot> Table FOOTer

表の各行は、ヘッダとフッタ1つづつと、1つ以上の本体とにグループ化できる。そのうちフッタ部分がこれである。

表ヘッダ [ひょうへっだ]

<thead> Table HEADer

表の各行は、ヘッダとフッタ1つづつと、1つ以上の本体とにグループ化できる。そのうちヘッダ部分がこれである。

表本体 [ひようほんたい]

<tbody> Table BODY

ひとつの table の中に複数の tbody を含めることができる(ただし、列の数が同じでないといけない)。データのグループ化のために使う。

太字 [ふとじ]

<b> Bold inline

文字を太字にする。なぜ字を太くしたいか考えて他の要素とCSSを組み合わせて実現した方がよい。

ふりがな

→ルビ

変数 [へんすう]

<var> VARiable inline

プログラムの変数を表す。

本文 [ほんぶん]

<body>

HTML文書の本文部分。この中にはブロックレベル要素(block-level と表示したもの)しか置けない。画像などのインライン要素は、段落などのブロックレベル要素に入れる必要がある。

ま行

見出し [みだし]

<h1>, <h2>, <h3>, <h4>, <h5>, <h6> Heading block-level

見出しを表す。数字が小さいほどレベルの高い見出しとなる。数字の小さい方から順に使う。

<h1>XHTML1.1 要素一覧</h1> <h2>文章を記述するための要素</h2>

見出し語 [みだしご]

<dt> Definition Term

定義リストの見出し語と説明のペアのうち、見出し語の方。

見出しセル [みだしせる]

<th> Table Header cell

見出し情報を持つセルを作る。abbr属性を使って省略形を指定しておくこと。

視覚系メディアにおいては、コマ内容すべてをレンダリングするのに充分な空間がない場合に、後者を用いるのが適切であろう。非視覚系メディアにおいては、コマに適用される見出しがコマの内容と共にレンダリングされる場合、見出しの省略形としてabbr属性が用いられるであろう。

<table summary="候補者得点表"> <tr><th abbr="氏名">申請書に記載の氏名</th><th abbr="得点">過去3回の成績の平均得点</th></tr> <tr><td>田中一平太</th><th>38点</th></tr> <tr><td>山田悟郎</th><th>79点</th></tr> </table>

ら行

リスト項目 [りすとこうもく]

<li> List Item

番号つきリスト(ol)や順不同リスト(ul)でリスト項目を表す。

略語 [りゃくご]

→省略語

リンク

→アンカー

ルビ

<ruby> inline

発音や意味などを表す短い文と、ベースとなる語句とを結び付ける。

<ruby><rb>強敵</rb><rt>とも</rt></ruby>

ルビ括弧 [るびかっこ]

<rp> Ruby Parentheses

ルビテキストをルビベースの脇にレンダリングできない場合、漢字(ふりがな) のようにルビベースとルビテキストを明確に分けるための括弧を表す。

<ruby><rb>漢字</rb><rp>(</rp><rt>ふりがな</rt><rp>)</rp></ruby>

ルビテキスト

<rt> Ruby Text

ふりがなそのもの。

ルビテキストコンポーネント

<rtc> Ruby Text Component

ルビテキストのグループ化のために使う。

<ruby> <rbc> <rb>手</rb> <rb>塚</rb> <rb>治</rb> <rb>虫</rb> </rbc> <rtc> <rt>て</rt> <rt>づか</rt> <rt>おさ</rt> <rt>む</rt> </rtc> </ruby>

ルビベース

<rb> Ruby Base

ふりがなを振られる側の語句。

ルビベースコンポーネント

<rbc> Ruby Base Component

ルビベースのグループ化のために使う。

列グループ生成 [れつぐるーぷせいせい]

表の中で明示的な1つの列グループを生成する。

列の属性指定 [れつのぞくせいしてい]

<col> table COLumn

表中で列の属性を指定する。要素の内容を持たない。

情報共有のしくみのための要素

関連情報 [かんれんじょうほう]

<link>

HTML文書が他の文書とどう関係しているかを表す。head要素内で使う。要素の内容を持たない。スタイルシートやページアイコンの指定もこの要素を使う。rel属性を使ってHTML文書側から見てどんな関係かを表す。

<link rel="prev" href="hoge01.html" title="ほげ01号" /> <link rel="next" href="hoge03.html" title="ほげ03号" /> <link rel="stylesheet" type="text/css" href="hoge.css" title="ほげ通常色" /> <link rel="icon" type="image/png" href="../icon.png" /> <link rel="shortcut icon" type="image/x-icon" href="../favicon.ico" />

基準URI [きじゅんゆーあーるあい]

<base>

href属性を使って基準となるURIを明示する。head要素内で使う。要素の内容を持たない。

<base href="http://www.hogehoge.jp/~taratara/" />

文書情報 [ぶんしょじょうほう]

<head>

タイトルなど、そのHTML文書のさまざまな情報を含む。

メタ情報 [めたじょうほう]

<meta>

著者名、キーワードなどの情報を設定する。

<meta name="Keywords" content="XHTML1.1, 要素,タグ" />

データの入力・選択・実行のための要素

説明 [せつめい]

fieldsetで作ったグループに説明をつける。

説明 [せつめい]

→ラベル

入力 [にゅうりょく]

<input> inline

一行だけの入力欄やチェックボックス、送信ボタンなどフォームの入力項目を作る。この形式は type属性によって決まる。

入力欄 [にゅうりょくらん]

<textarea> inline

複数行のテキスト入力欄を作る。要素の内容が入力欄の初期値になる。

<form action="http://sample.com/cgi/post.cgi" method="post"> <p> <textarea name="thetext" rows="20" cols="80"> ※症状をお書きください。 (できるだけ具体的に) </textarea> <input type="submit" value="送る" /> <input type="reset" /> </p> </form>

フィールドセット

<fieldset> block-level

フォームのコントロールとラベルとをグループ化する

フォーム

<form> block-level

入力欄、選択リストなどの「コントロール」の入れものとなる。

<form action="http://www.hoge.jp/prog/hoge" method="post"> <label>名前 <input type="text" name="name" /></label> <input type="submit" value="OK" /> </form>

ボタン

<button> inline

ボタンを作る。

メニュー

<select> inline

メニューを作る。

<p>好きなタイプを選んでね <select name="favorite"> <optgroup label="けもの"> <option>ねこみみ</option> <option>いぬみみ</option> <option>きつね</option> </optgroup> <optgroup label="職業"> <option>巫女さん</option> <option>婦警さん</option> <option>看護婦さん</option> </optgroup> </select></p>

メニュー項目 [めにゅーこうもく]

メニューの項目。

メニュー項目のグループ化 [めにゅーこうもくのぐるーぷか]

メニュー項目をグループ化する。一部のブラウザではグループ化された項目がサブメニューとして表示される。

ラベル

<label> inline

フォームのコントロールに説明文をつける。