HTML要素は、 HTML(HyperText Markup Language)ドキュメントコンポーネントの一種であり、HTMLノードのいくつかの種類の1つです(一般的なノードの種類には、ドキュメント、ドキュメントフラグメント、インターフェース、属性ノードなどがあります)。[ 1 ] HTMLの最初の使用バージョンは、 1993年にティム・バーナーズ=リーによって作成され、それ以来、HTMLには多くのバージョンがあります。現在の事実上の標準は、業界グループWHATWGによって管理されており、 HTMLリビングスタンダードとして知られています。
HTMLドキュメントは、テキストノードなどの単純なHTMLノードと、ドキュメントの一部に意味や書式設定を追加するHTML要素(テキストを太字にする、段落、リスト、表に整理する、ハイパーリンクや画像を埋め込むなど)からなるツリー構造で構成されています。各要素にはHTML属性を指定できます。また、要素には他の要素やテキストなどのコンテンツを含めることができます。

一般的に理解されているように、要素の位置は開始タグから始まり終了タグで終わると示されます。[ 2 ]これは、HTML ドキュメント内の多くの要素に当てはまりますが、すべてではありません。この区別はHTML 4.01 仕様で明示的に強調されています。[ 3 ]
要素はタグではありません。要素をタグと呼ぶ人もいますが(例:「Pタグ」)、要素とタグ(開始タグまたは終了タグ)は別物であることを覚えておいてください。例えば、マークアップに開始タグと終了タグの両方のHEADタグがなくても、HEAD要素は常に存在します。
同様に、W3C勧告HTML 5.1第2版では明示的に次のように述べられています。[ 4 ]
タグは、マークアップ内の要素の開始と終了を区切るために使用されます。[...] 特定の通常の要素の開始タグと終了タグは省略できます。[...]要素の内容は、開始タグの直後(場合によっては省略されることもあります)と終了タグの直前(これも場合によっては省略されることもあります)の間に配置する必要があります。
そして:[ 4 ]
特定のタグは省略できます。注:要素の開始タグ[...]を省略しても、要素が存在しないという意味ではありません。省略しても要素は存在します。たとえば、HTMLドキュメントには、マークアップのどこにも<html>文字列<html>が表示されない場合でも、必ずルート要素があります。
HTML ( HTML5 以前) はSGMLに基づいているため、[ 5 ]その解析も文書型定義(DTD)、特に HTML DTD (例: HTML 4.01)に依存します。 [ 6 ] [注 1 ] DTD は、どの要素型が可能か (つまり、要素型のセットを定義します) と、ドキュメント内で出現できる有効な組み合わせを指定します。 SGML の一般的な動作として、有効な構造が 1 つだけ可能な場合(DTD に従って)、特定のドキュメントでその構造を明示的に記述する必要は通常ありません。 簡単な例として、段落要素の開始を示すタグには、その終了を示すタグが補完される必要があります。 しかし、段落要素はネストできないと DTD で規定されているため、HTML ドキュメントの断片はと同等であると推測されます。 (ある段落要素が別の段落要素を包含できない場合、現在開いている段落は閉じてから次の段落を開始する必要があります。)この含意は DTD と個々の文書の組み合わせに基づいているため、通常は文書タグのみから要素を推測することはできず、DTD の知識を持つ SGML または HTML 対応のパーサーを使用することによってのみ可能です。HTML5 は、省略可能なタグを定義することによって同様の結果を生み出します。[ 7 ]<p></p><p>Para 1 <p>Para 2 <p>Para 3<p>Para 1 </p><p>Para 2 </p><p>Para 3
SGMLは複雑であるため、広く理解され採用されるには至っていません。XMLはよりシンプルな代替手段として開発されました。どちらもDTDを使用して、ドキュメント構造としてサポートされる要素とその許容される組み合わせを指定できますが、XMLの解析の方がシンプルです。タグから要素への関係は常に、SGMLの一部である暗黙のクロージャなしで、ドキュメントに含まれる実際のタグを解析することです。[注2 ]
現在のウェブで使用されているHTMLは、XHTMLとしてXMLとして扱われるか、HTML5として扱われるかのいずれかである可能性が高い。いずれの場合も、ドキュメントタグをドキュメントオブジェクトモデル(DOM)要素に解析するプロセスは、従来のHTMLシステムに比べて簡素化されている。要素のDOMが取得されると、インターフェースの上位レベル(例:画面レンダリング)での動作は同一か、ほぼ同じになる。[注3 ]
%block;対ボックスこのCSSの表示動作の一部に、「ボックスモデル」という概念があります。これは、CSS宣言によって設定された、CSSが「ブロック」要素とみなす要素に適用されます。display:block;
HTMLにも同様の概念がありますが、異なるため、この2つは非常によく混同されます。%block;とは、 %inline;HTML DTD内のグループで、要素を「ブロックレベル」または「インライン」としてグループ化します。[ 9 ]これは、要素のネスト動作を定義するために使用されます。ブロックレベル要素は、インラインコンテキストに配置することはできません。[注4 ]この動作は変更できません。DTDで固定されています。ブロック要素とインライン要素には、デフォルトで適切な異なるCSS動作が関連付けられています。[ 9 ]これには、特定の要素タイプに対するボックスモデルの関連性も含まれます。
ただし、この CSS の動作はデフォルトから変更することができ、また頻繁に変更されることに注意してください。 を持つリストは要素であり、デフォルトではブロック要素として表示されます。しかし、これらを CSS で設定してインラインリストとして表示することはよくあります。[ 10 ]<ul><li> ...%block;
HTML構文では、ほとんどの要素は開始タグと終了タグで記述され、その間にコンテンツが記述されます。HTMLタグは、山括弧で囲まれた要素名で構成されます。終了タグには、開始山括弧の後にスラッシュが付きます。[ 11 ]: 23-24例えば、要素で表される段落は、次のように記述されます。<p>
<p> HTML構文では、ほとんどの要素は次のように記述されます... </p>しかし、これらの要素すべてに終了タグ、あるいは開始タグさえも必要なわけではありません。 [ 7 ]いわゆる空要素と呼ばれる要素には終了タグがありません。典型的な例は、(ハード改行)要素です。空要素の動作はあらかじめ定義されており、コンテンツや他の要素を含めることはできません。例えば、住所は次のように記述されます。<br>
<p> P.シャーマン<br>ウォラビーウェイ42番地<br>シドニー</p>XHTMLを使用する場合、空要素を含むすべての要素を開閉する必要があります。これは、開始タグの直後に終了タグを配置することで実現できますが、これは HTML 5 では認められておらず、2 つの要素が作成されてしまいます。XHTML と HTML 5 の両方と互換性のある、空要素であることを指定する別の方法は、タグの/最後に` <void>` を配置することです (閉じタグの/先頭にある`<void>`と混同しないように注意してください)。
<p> P.シャーマン<br />ウォラビーウェイ42番地<br />シドニー</p>HTML属性は開始タグ内に指定され、属性名、等号、値で構成されます。例:[ 11 ]: 25-26
< p lang = " en -us" >英語の段落</p>HTML5以降、HTMLでは属性名を大文字で使用したり、引用符を省略したりすることが可能になった。[ 11 ]: 26
非公式には、HTML要素は「タグ」と呼ばれることもありますが(これは提喩の一例です)、多くの人は、要素の開始と終了を区切るマークアップを指す場合にのみ「タグ」という用語を好んで使用します。
HTML では要素 (および属性) 名は大文字と小文字の任意の組み合わせで記述できますが、XHTML では小文字でなければなりません。[ 12 ] HTML 4までは標準形式は大文字で、HTML 仕様で使用されていましたが、近年では小文字がより一般的になっています。
HTML要素には、通常の要素、生のテキスト要素、および空要素の3種類があります。
通常の要素は通常、開始タグと終了タグの両方を持ちますが、一部の要素では終了タグ、または両方のタグを省略できます。同様の方法で構築されます。
<tag></tag>生のテキスト要素(テキスト要素またはテキストのみの要素とも呼ばれる)は、以下で構成されます。
<tag></tag>例えば、要素には他の要素(テキストのマークアップを含む)を含めてはならず、プレーンテキストのみを含めなければなりません。<title>
空要素(空要素、単一要素、またはスタンドアロン要素とも呼ばれます)は、開始タグ(形式)のみを持ち、その中に任意の HTML 属性が含まれます。テキストや他の要素などの子要素を含めることはできません。XHTML との互換性のために、HTML 仕様ではオプションでスペースとスラッシュ(は許可されます)が認められています。スラッシュはXHTMLやその他のXMLアプリケーションでは必須です。一般的な空要素は(詩や演説などのハード改行(テーマ区切り)です。その他の空要素は、画像( )要素のように、外部ファイルを参照するプレースホルダーであることがよくあります。要素に含まれる属性は、該当する外部ファイルを指します。空要素のもう 1 つの例は で、構文は次のとおりです。<tag><tag/><br/><hr/>"},"parts":[{"template":{"target":{"wt":"code","href":"./Template:Code"},"params":{"lang":{"wt":"html"},"code":{"wt":""}},"i":0}}]}"><img/>
<link/>
< link rel = "stylesheet" href = "fancy.css" type = "text/css" >この要素は、HTML ドキュメントをユーザーに表示する際に使用するスタイル シートをブラウザに指示します。HTML 構文では、属性が特定の文字 (文字、数字、ハイフン、ピリオド) のみで構成されている場合は、引用符で囲む必要はありません。一方、XML 構文 (XHTML) を使用する場合は、すべての属性を引用符で囲む必要があり、最後の山括弧の前にスペースを空けた末尾のスラッシュが必要です。<link/>
< link rel = "stylesheet" href = "fancy.css" type = "text/css" />HTML属性は、望ましい動作を定義したり、要素の追加プロパティを示したりします。ほとんどの属性には値が必要です。HTMLでは、値にスペースが含まれていない場合は引用符なしで記述できます()、またはシングルクォートまたはダブルクォートで引用符を付けることができます(または)。XMLでは、これらの引用符は必須です。attribute=valueattribute='value'attribute="value"
一方、ブールchecked属性は値を指定する必要がありません。例としては、チェックボックスが挙げられます。
< input type = "checkbox " checked >ただし、 XML(したがってXHTML)の構文では、値が必須であり、名前を値として繰り返す必要があります。
<input type= "checkbox" checked= "checked" />HTML要素は、1995年以降に発行された一連の自由に利用可能なオープン標準で定義されており、当初はIETFによって、その後はW3Cによって発行されました。
1990年代のブラウザ戦争中、ユーザーエージェント(ウェブブラウザなど)の開発者は独自の要素を開発することが多く、その一部は後の標準規格に採用されました。他のユーザーエージェントは非標準要素を認識できない場合があり、それらは無視されるため、ページが正しく表示されない可能性があります。
1998年、XML (SGMLの簡略化された形式)は、XML対応のユーザーエージェントで使用するために、誰でも独自の要素を開発してXHTMLドキュメントに組み込むことができるメカニズムを導入しました。 [ 13 ]
その後、HTML 4.01 はXML互換の形式であるXHTML 1.0 ( eXtensible HTML )に書き直されました。両者の要素は同一であり、ほとんどの場合、有効な XHTML 1.0 文書は有効な、またはほぼ有効な HTML 4.01 文書となります。特に断りのない限り、この記事は主に実際の HTML に焦点を当てていますが、XHTML にも適用可能です。両者の細かな違いについては、HTML の項を参照してください。
HTMLの最初のバージョン以降、いくつかの要素が時代遅れになり、後の標準では非推奨になったり、まったく存在しなくなったりしています。後者の場合、それらは無効です(検証ユーザーエージェントによって無効と判断され、表示されない可能性があります)。[ 14 ]
HTML 4.01 / XHTML 1.0では、3 種類のDTDが存在するため、要素の状態が複雑になっています。
HTML5では、標準化された規範的コンテンツに付随する廃止された機能のリストが提供されています。これらは、実装手順が存在する「廃止されているが準拠している」機能と、置き換えるべき「非準拠」機能に分類されます。[ 15 ]
最初の標準 ( HTML 2.0 ) には、4 つの非推奨要素が含まれており、そのうちの 1 つはHTML 3.2では無効でした。これら 4 つはすべてHTML 4.01 Transitionalでは無効であり、さらに 10 個の要素が非推奨になりました。これらすべてに加えて、さらに 2 つの要素がHTML 4.01 Strictでは無効です。フレーム要素は Transitional および Frameset DTD に存在するという意味ではまだ現役ですが、その機能はほぼ置き換えられており、ユーザー アクセシビリティにとって非常に問題があるため、将来の標準でこれらを維持する予定はありません。
(厳密に言えば、最新のXHTML標準であるXHTML 1.1 (2001) にはフレームは全く含まれていません。これはXHTML 1.0 Strictとほぼ同等ですが、Ruby マークアップモジュールも含まれています。)[ 16 ]
よくある混乱の原因は、「非推奨」という言葉が、非推奨状態と無効な状態の両方を指す場合や、将来的に正式に非推奨になると予想される要素を指す場合に、曖昧に使われていることである。
HTML 4以降、HTMLはコンテンツ(表示されるテキストや画像)とプレゼンテーション(色、フォントサイズ、レイアウトなど)の分離にますます重点を置くようになりました。[ 17 ]これはしばしば関心の分離と呼ばれます。HTMLはドキュメントの構造やコンテンツを表すために使用され、そのプレゼンテーションはCSSスタイルシートの専任の責任となります。CSS標準の一部としてデフォルトスタイルシートが提案されており、HTMLのデフォルトのレンダリングを提供します。[ 18 ]
動作(インタラクティブ性)もコンテンツとは切り離されており、スクリプトによって処理されます。画像はテキストとは別のグラフィックファイルに格納されますが、ページコンテンツの一部とみなすこともできます。
関心の分離により、異なるユーザーエージェントがそれぞれの目的や能力に応じて文書を提示することが可能になります。例えば、ユーザーエージェントは、モニターへの表示、紙への印刷、音声専用ユーザーエージェントにおける音声特性の判定など、文書を提示する用途に応じて適切なスタイルシートを選択できます。いずれの場合も、マークアップの構造的機能と意味的機能は同一です。
歴史的に、ユーザーエージェントは必ずしもこれらの機能をサポートしていませんでした。1990年代には、暫定的な措置として、プレゼンテーション要素(やなど)がHTMLに追加されましたが、相互運用性とユーザーアクセシビリティに問題が生じました。これは現在では時代遅れとみなされ、スタイルシートベースの設計に取って代わられ、ほとんどのプレゼンテーション要素は現在非推奨となっています。[ 19 ]<b><i>
外部画像ファイルは、または要素に組み込まれます。(XHTMLでは、SVG言語を使用してドキュメント内にグラフィックを書き込むこともできますが、外部 SVG ファイルへのリンクの方が一般的に簡単です。)[ 20 ]画像が純粋に装飾的なものでない場合、HTML では、視覚に頼らないユーザー エージェント向けに、同様の意味的価値を持つ代替コンテンツを提供できます。<img/><object/>
HTMLドキュメントは、スクリプトを使用することで拡張することができ、HTMLのハイパーリンクやフォームの機能を超えた追加の動作を提供できます。
要素と は、関連するHTML 属性とともに、スタイルシートとスクリプトを提供します。<style><script>
<style/><script/><style>...</style><script>...</script><link><script/>または、文書内のどの箇所(冒頭または本文)でも発生する可能性があります。<script>...</script>styleほとんどのドキュメント本文要素(例:)で有効です。<divstyle="..."><noscript>...</noscript><html>...</html><head>...</head><body></body><base />href<base>BASEで言及されており、HTML 2.0で標準化され、現在も使用されています。<basefont />(deprecated)<font>
<isindex />(deprecated)<isindex>はドキュメントのヘッダーまたは本文のどちらかに表示できますが、ドキュメント内では一度しか表示できません。 は、を送信する代わりに?string、 として単一のパラメータを送信するテキスト?query=stringフィールドを表示します。フォームを参照してください。<link /><linkrel="stylesheet"type="text/css"href="url"title="description_of_style"><linkrel="next"href="url"><head><link/>LINKHTMLインターネットドラフト1.2に存在し、HTML2.0で標準化された。現在も使用されている。<meta />は、ドキュメントの作成者、発行日、有効期限、言語、ページタイトル、ページの説明、キーワード、または他のヘッダー要素やHTML 属性では提供されないその他の情報など、ドキュメントに関する追加のメタデータを指定するために使用できます。 は汎用的な性質を持つため、は関連付けられたキーと値のペアを指定します。 一般的に、メタ要素はドキュメントに関する隠された情報を伝えます。 複数のメタタグを使用できますが、それらはすべて head 要素内にネストする必要があります。 各要素の具体的な目的は、その属性によって定義されます。 XHTML以外では、空要素であるにもかかわらず、スラッシュ ( )なしで指定されることがよくあります。<meta/><meta/><meta>
ある形式では、要素は、実際のコンテンツの前にウェブサーバーによって送信されるべきHTTPヘッダーを指定できます。たとえば、 は、値が であるという HTTP ヘッダーとともにページが配信されるべきであることを指定します。<meta/><metahttp-equiv="foo"content="bar"/>foobar
<meta/>namecontentscheme<metaname="foo"content="bar"scheme="DC"/><meta/>foobar<object>...</object><head><script>...</script>src属性を使用して外部スクリプトにリンクしたりできます。[ 23 ]また、ドキュメント本文で使用して、ブロックコンテンツまたはインラインコンテンツの両方を動的に生成することもできます。<style>...</style><styletype="text/css">...</style>@import<style>@importurl;</style><title>...</title><title><title>ビジュアルブラウザでは、表示可能な要素はブロック要素またはインライン要素としてレンダリングされます。すべての要素はドキュメントシーケンスの一部ですが、ブロック要素は親要素内に表示されます。
一方、インライン要素は文書テキストの流れの一部として扱われるため、余白、幅、高さを設定することはできず、行をまたいで改行されます。
ブロック要素、またはブロックレベル要素は、長方形の構造を持ちます。デフォルトでは、これらの要素は親要素の幅全体に広がるため、他の要素が配置された水平方向のスペースを占めることはできません。
ブロック要素の長方形構造は、しばしばCSSボックスモデルと呼ばれ、いくつかの部分から構成されています。各要素には以下のものが含まれます。
上記のセクションは、CSSレンダリングの詳細な実装についてのみ言及しており、HTML要素自体とは関係ありません。
<p>...</p>PHTMLタグに存在し、HTML 2.0で標準化された。現在も使用されている。<h1>...</h1><h2>...</h2><h3>...</h3><h4>...</h4><h5>...</h5><h6>...</h6>h1最上位の見出しを区切り、h2はその次のレベル (サブセクション) を区切り、h3はそのさらに下のレベルを区切り、 まで続きます。 これらはまとめてタグh6と呼ばれることもあり、 n は使用可能な見出しレベルのいずれでも意味します。 ほとんどのビジュアルブラウザでは、見出しはデフォルトで太字の大きなテキストとして表示されますが、これはCSSで上書きできます。 見出し要素は、単に大きなテキストや太字のテキストを作成するためだけのものではありません。実際、テキストを明示的にスタイル設定するために使用すべきではありません。むしろ、ドキュメントの構造と構成を記述します。 一部のプログラムでは、アウトラインや目次を生成するためにこれらを使用します。hn<dl>...</dl>DLHTMLタグに存在し、HTML 2.0で標準化された。現在も使用されている。<dt>...</dt>DTHTMLタグに存在し、HTML 2.0で標準化された。現在も使用されている。<dd>...</dd>DDHTMLタグに存在し、HTML 2.0で標準化された。現在も使用されている。<ol>...</ol>type属性を使用してリストで使用するマーカーの種類を指定できますが、スタイルシートの方がより詳細な制御が可能です。デフォルトはアラビア数字です。HTML属性では、; またはCSS宣言では、 を以下のいずれかに 置き換えます。<oltype="foo">ol{list-style-type:foo;}fooA; CSS値:upper-alphaa; CSS値:lower-alphaI; CSS値:upper-romani; CSS値:lower-roman1;decimalnone 、ヘブライ語、グルジア語、アルメニア語の文字に対応するオプションなどです。属性はHTML 3.2および4.01では非推奨となっていますが、HTML 5では非推奨ではありません。OLHTMLインターネットドラフト1.2に存在し、HTML2.0で標準化された。現在も使用されている。<ul>...</ul><ultype="foo">ul{list-style-type:foo;}foodiscsquarecirclenoneULHTMLタグに存在し、HTML 2.0で標準化された。現在も使用されている。<li>...</li>ol順序付きリスト( )または順序なしリスト( )のリスト項目ul。LIHTMLタグに存在し、HTML 2.0で標準化された。現在も使用されている。<dir>...</dir>(deprecated)<ul>DIRHTML タグに存在し、HTML 2.0で標準化されました。HTML 4.0 Transitionalで非推奨となり、HTML 4.0 Strictでは無効です。<address>...</address>ADDRESSHTMLタグに存在し、HTML 2.0で標準化された。現在も使用されている。<article>...</article><aside>...</aside><blockquote>...</blockquote>cite(要素と混同しないように注意) はソースを指定することができ、完全修飾Uniform Resource Identifierでなければなりません。ビジュアル ブラウザーでのブロック引用のデフォルトの表示は、通常、両方の余白からインデントされます。このため、意味に関係なく、段落をインデントするためだけに要素が不必要に使用されるようになりました。ただし、テキストをインデントするためだけに要素を非意味的に使用することは、HTML 4 以降、W3C ( World Wide Web Consortium ) によって非推奨となっています。 [ 29 ] 推奨される方法は、CSSを使用することです。ブロック レベルの要素を含まない引用については、quote ( ) 要素を参照してください。<cite>blockquote<q>BLOCKQUOTEHTMLインターネットドラフト1.2に存在し、HTML2.0で標準化された。現在も使用されている。<center>...</center>(deprecated)<div><del>...</del><div>...</div><figure>...</figure><figcaption><figcaption>...</figcaption><figure><header>...</header><hr /><ins>...</ins><main>...</main><ul>MENUHTML タグに存在し、HTML 2.0で標準化されました。HTML 4.0 Transitionalで非推奨となり、HTML 4.0 Strictでは無効になりました。その後、 HTML5で再定義され、HTML 5.2 で削除されましたが、2019 年の HTML Living Standard に含まれています。<noscript>...</noscript><pre>...</pre><pre>...</pre>{white-space:pre;font-family:monospace;}<image><object><big><small><sup><sub>...</sub>PREHTMLインターネットドラフト1.2に存在し、HTML2.0で標準化された。現在も使用されている。<section>...</section><div><script>...</script><script/>src<script>...</script><script>インライン要素は要素内に直接配置することはできません。ブロックレベル要素内に完全にネストする必要があります。[ 30 ]<body>
<a>...</a>アンカー要素は、ウェブデザイナーがウェブページ上のテキストにURLを「固定」するために使用できるため、アンカーと呼ばれます。ユーザーがブラウザでウェブページを表示すると、テキストをクリックしてリンクをアクティブにし、リンクに含まれるURLのページに移動できます。[ 31 ]
HTML では、「アンカー」はハイパーリンクの起点(アンカーテキスト) または終点(宛先) のいずれかになります。起点として属性を設定すると[ 32 ]ハイパーリンクが作成され、ドキュメントの別の部分または外部URLを使用した別のリソース (たとえば Web ページ) を指すことができます。終点としてHTML 属性またはHTML 属性を設定すると、フラグメント識別子を介してUniform Resource Locator (URL)から要素にリンクできます。起点とアンカーの 2 つの形式は同時に使用できます。hrefnameid
HTML5では、属性を使用することで任意の要素をターゲットにすることができるようになったためid、[ 33 ]を使用する必要はありませんが、このアンカーを追加する方法は引き続き機能します。<aname="foo">...</a>
例として、目次セクションのヘッダーexample.comのホームページをターゲットにするには、次のように記述します。。これでセクションがターゲットとしてマークアップされたので、次のようなリンクで外部サイトから参照できます。 ; または、同じページ内の次のようなリンクで参照できます。 。<h2><aname="contents">Table of contents</a></h2><ahref="http://example.com#contents">see contents</a><ahref="#contents">contents, above</a>
titleリンクに関する簡単な情報を提供するために、属性を設定できます。<ahref="URL"title="additional information">link text</a>
ほとんどのグラフィカルブラウザでは、カーソルをリンクの上に重ねると、カーソルが人差し指を伸ばした手の形に変わり、ツールチップなどでtitle値が表示されます。一部のブラウザは代替テキストも同様に表示しますが、これは仕様で定められている動作ではありません。
句要素は、句をマークアップしたり、テキスト断片に構造や意味を追加したりするために使用されます。たとえば、<p>タグと<p>タグは、テキストを強調するために使用できます。<em><strong>
<abbr>...</abbr><abbrtitle="abbreviation">abbr.</abbr><acronym>...</acronym>(deprecated)<abbr><acronymtitle="Hyper-Text Mark-up Language">HTML</acronym>abbr<dfn>...</dfn>DFNHTMLインターネットドラフト1.2に存在し、HTML3.2で完全に標準化された。現在も使用されている。<em>...</em>EMHTMLインターネットドラフト1.2に存在し、HTML2.0で標準化された。現在も使用されている。<strong>...</strong>STRONGHTMLインターネットドラフト1.2に存在し、HTML2.0で標準化された。現在も有効であり、HTML5で再定義されている。これらの要素は、ソースコード()、変数()、ユーザー入力()、端末またはその他の出力( )を区別することにより、コンピュータコードの開発とユーザーとのやり取りを文書化するのに主に役立ちます。<code><var><kbd><samp>
<code>...</code>code example)。慣例として等幅フォントで表示されます。CODEHTMLインターネットドラフト1.2に存在し、HTML2.0で標準化された。現在も使用されている。<kbd>...</kbd>KBDHTMLインターネットドラフト1.2に存在し、HTML2.0で標準化された。現在も使用されている。<samp>...</samp>SAMPHTMLインターネットドラフト1.2に存在し、HTML2.0で標準化された。現在も使用されている。<var>...</var>VARHTMLインターネットドラフト1.2に存在し、HTML2.0で標準化された。現在も使用されている。視覚的な表示マークアップは視覚ブラウザにのみ直接適用されるため、その使用は推奨されません。代わりにスタイルシートを使用してください。これらの要素のいくつかは HTML 4 / XHTML 1.0 では非推奨または無効となっており、残りはXHTML 2.0の現行ドラフトで無効となっています。しかし、 HTML5の現行ドラフトでは、、、およびが再び含まれ、それぞれに新しい意味が割り当てられています。HTML5ドキュメントでは、意味的に正しい限り、これらの要素の使用はもはや推奨されません。 <s><u><small>
<b>...</b>{font-weight:bold;}<strong><b><strong>BHTMLインターネットドラフト1.2に存在し、HTML2.0で標準化された。現在も有効であり、HTML5で再定義されている。<i>...</i>{font-style:italic;}<em>...</em><i><em>IHTMLインターネットドラフト1.2に存在し、HTML2.0で標準化された。現在も有効であり、HTML5で再定義されている。<u>...</u>{text-decoration:underline;}<u><u>UHTML Internet Draft 1.2に存在し、HTML 3.2で標準化されたが、HTML 4.0 Transitionalで非推奨となり、HTML 4.0 Strictでは無効となった。HTML5で再導入された。<small>...</small>{font-size:smaller;}<small><aside>...</aside><s>...</s><strike><s><del>SHTML 4.0 Transitionalでは非推奨となり(以前の標準には登場していなかった)、HTML 4.0 Strict では無効となった。HTML5で再導入されたが、代わりに が非推奨となった。<strike><big>...</big>(deprecated){font-size:larger;}<strike>...</strike>(deprecated){text-decoration:line-through;}STRIKEHTML 3.2で標準化されました。HTML 4.0 Transitionalで非推奨になりました。HTML 4.0 Strictでは無効です。<tt>...</tt>(deprecated){font-family:monospace;}TTHTML Internet Draft 1.2に存在し、HTML 2.0で標準化されました。HTML5 ではサポートされていません[ 40 ]。代替案としては、ユーザー入力のマーク、変数 (通常は斜体でレンダリングされ、等幅フォントに変更されません)、ソースコード、出力などが考えられます。[ 40 ]<kbd><var><code><samp><font>...</font>(deprecated)<font[color=<var>color</var>] [size=<var>size</var>] [face=<var>face</var>]>...</font> 属性でフォントの色color(アメリカ英語のスペルに注意)、face属性で書体、属性で絶対サイズまたは相対サイズを指定できますsize。例(すべて非推奨です。可能な場合はCSSの同等の機能を使用してください): <fontcolor="green">text</font>緑色のテキストを作成します。<fontcolor="#114499">text</font>16進数カラー#114499でテキストを作成します。<fontsize="4">text</font>サイズ4のテキストを作成します。サイズは1から7までです。 <body>タグまたはその他のタグで特に指定がない限り、標準サイズは3です。<fontsize="+1">text</font>標準サイズより1大きいサイズのテキスト を作成します。はその逆です。<fontsize="-1">text</font><fontface="Courier">text</font>Courierフォントでテキストを作成します。フォント属性に対応するCSS:
<fontsize="N">これは、 (HTML仕様ではサイズNと単位サイズYの関係が定義されておらず、単位も定義されていない){font-size:Yunits}<fontcolor="red">対応する{color:red;}<fontface="Times New Roman">これは、CSS が2 つ以上の代替フォントのフォントスタックをサポートすることに対応します。{font-family:'Times New Roman',Times,serif;}<br /><bdi>...</bdi><bdo>...</bdo><cite>...</cite><cite><cite>...</cite>この要素に関するもう一つの問題点は、WHATWGがデフォルトで斜体にするよう推奨していること(そのため、ほとんどすべてのブラウザがそうしています)です。WHATWGの見解では、これは出版物のタイトルにのみ使用されるものだからです。しかし、慣例として、実際に斜体にするのは特定の種類のタイトルのみであり、他のタイトルは引用符で囲むことが期待されます。また、出版の文脈や言語によって基準が異なる場合もあります。そのため、多くのウェブサイトの作成者や管理者は、サイト全体のスタイルシートを使用して、この要素の自動斜体化を解除しています。
<data>...</data><del>...</del><ins>...</ins><del><s>挿入されたテキスト。<ins><del><del><del><mark>...</mark><q>...</q><blockquote><q>cite<rb>...</rb><rp>...</rp><rt>...</rt><rtc>...</rtc><ruby>...</ruby><script>...</script><script><sub>...</sub><sup>...</sup>{vertical-align:sub;}{vertical-align:super;}<template>...</template><time>...</time><wbr /><applet>...</applet>(deprecated)<object><area /><map><audio>...</audio>srcを追加します。オーディオのURLは属性を使用して決定されます。サポートされているオーディオ形式はブラウザによって異なります。<canvas>...</canvas><embed>...</embed><object><img />src挿入するために使用します。属性は画像の URL を指定します。requiredalt属性は、画像が表示できない場合の代替テキストを提供します。[ 58 ] (alt代替テキストとして意図されていますが、Microsoft Internet Explorer 7 以前では、属性が指定されていない場合、ツールチップtitleとしてレンダリングされます。[ 59 ] 一方、SafariとGoogle Chromeでは、alt 属性は全く表示されません。) [ 60 ]この要素は、 Marc Andreessenによって最初に提案され、 NCSA Mosaic Web ブラウザで実装されました。[ 61 ]<img/>IMGHTMLインターネットドラフト1.2に存在し、HTML2.0で標準化された。現在も使用されている。<map>...</map><object>...</object>type。これは、埋め込みHTMLページ、 Flashなどのプラグインで処理されるファイル、Javaアプレット、音声ファイルなど、ユーザーエージェントが理解できる任意のMIMEタイプにすることができます。<param /><applet><object><object><param/><source>...</source>srcます。<video><audio><track>...</track><video>...</video>src属性を使用して決定されます。サポートされている動画フォーマットはブラウザによって異なります。これらの要素は、フォームとして組み合わせることも、場合によってはユーザーインターフェースコントロールとして個別に使うこともできます。ドキュメント内では、シンプルなHTMLとして記述することも、スクリプトと組み合わせて使用することも可能です。HTMLマークアップは、フォームを構成する要素と、フォームの送信方法を指定します。ただし、送信されたユーザーの入力を処理するには、何らかのスクリプト(サーバー側、クライアント側、またはその両方)を使用する必要があります。
(これらの要素はブロック要素またはインライン要素のいずれかですが、他のインライン要素やブロック要素よりも使用が制限されているため、ここにまとめています。)
<form action="url">...</form><form>action<datalist>...</datalist>optionフォーム要素で使用するsのリスト。<fieldset>...</fieldset><fieldset><legend><input /><input>これらの要素により、さまざまな標準フォームコントロールを実装できます。<button>src属性で指定できます。size属性は、文字幅単位で入力フィールドのデフォルトの幅を指定します。max-lengthユーザーが入力できる最大文字数を設定します(サイズよりも大きい場合があります)。text検索バーが表示されるものがある。textです。違いは、このフィールドに入力されたテキストがマスクされる点です。文字はアスタリスク、ドット、またはその他の置換文字として表示されます。パスワードは依然として平文でサーバーに送信されるため、機密性が懸念される場合は、HTTPSなどの安全な通信プロトコルが必要です。text電話番号のバリエーション。textメールアドレスのバリエーション。textURLのバリエーション。text数字の変形。hidden入力フィールドはレンダリングされたページには表示されませんが、フォームの一部としてサーバーに送信する必要のあるデータのコピーをデザイナーが保持できるようにします。これは、たとえば、このWebユーザーが以前のフォームで入力または選択したデータで、現在のフォームと併せて処理する必要があるデータです。ユーザーには表示されませんが、HTMLソースを編集することでクライアント側でデータを変更できます。<isindex />(deprecated)<isindex/>ドキュメントのヘッダーまたは本文のどちらかに表示できますが、ドキュメント内では一度しか表示できません。 は原始的な HTML 検索フォームとして機能しましたが、 1990 年代初頭から中頃にかけて導入されたより高度な HTML フォームによって事実上廃止されました。 は、ベース URI、アンパサンド、およびプラス記号で区切られたパーセントエンコードされたキーワードで構成されるハイパーリンクのセットを表します。<isindex/>ISINDEXHTML タグに存在。HTML 2.0で標準化。HTML 4.0 Transitionalで非推奨。HTML 4.0 Strictで無効。<keygen>...</keygen>(deprecated)<label for="id">...</label>radio。ラベルをクリックすると、対応する入力フィールドがクリックされます。<legend>...</legend><fieldset><meter>...</meter>value。min、low、high、 も持つことができますmax。<option value="x">...</option><select><optgroup>...</optgroup><option><select><output>...</output><progress>...</progress><select name="xyz">...</select><textarea rows="8">...</textarea>cols(1列はテキストの1文字幅)とrowsHTML属性によって指定されます。この要素の内容はプレーンテキストに制限され、ページ読み込み時にテキストエリアにデフォルトテキストとして表示されます。HTMLテーブルの形式は、HTML 3.0ドラフトおよび後のRFC 1942 HTML Tablesで提案されました。これらはCALSテーブルモデルに触発されたものです。これらの提案に含まれる要素の一部はHTML 3.2に採用され、現在のHTMLテーブルの形式はHTML 4で標準化されました。(テーブル内で使用される要素の多くは、ブロック要素でもインライン要素でもありません。)
<table>...</table>summary属性はアクセシビリティの観点から非公式に必要とされていますが、その使い方は簡単ではありません。<tr>...</tr><table><th>...</th><table><td>...</td><table><colgroup>...</colgroup><table><col>...</col><table><caption>...</caption><table><thead>...</thead><table><tbody>...</tbody><table><tfoot>...</tfoot><table><thead>フレームを使用すると、視覚的な HTML ブラウザ ウィンドウをセグメントに分割でき、各セグメントに異なるドキュメントを表示できます。これにより、レイアウトの繰り返し部分を 1 つのフレームで使用し、可変コンテンツを別のフレームに表示できるため、帯域幅の使用を削減できます。ただし、特に非視覚的なユーザー エージェントでは、別々の独立したドキュメント (または Web サイト)が隣接して表示され、同じ親ウィンドウとやり取りできるため、ユーザビリティに一定のコストがかかる場合があります。このコストのため、フレーム (要素を除く)はHTML 4.01 フレーム セットでのみ許可されています。iframe は、異なるサーバー上のドキュメントを保持することもできます。この場合、ウィンドウ間のやり取りはブラウザによってブロックされます。FacebookやTwitterなどのサイトは、iframe を使用してサードパーティ Web サイトにコンテンツ (プラグイン) を表示します。Google AdSense は、 iframe を使用してサードパーティ Web サイトにバナーを表示します。<iframe>
HTML 4.01では、ドキュメントには と またはとを含めることができますが、 と の両方を含めることはできません。ただし、 は通常のドキュメント本文で使用できます。<head><body><head><frameset><body><frameset><iframe>
<frameset>...</frameset>(deprecated)<frame/>rowscols<frame />(deprecated)<frameset>src<frame/><noframes>...</noframes>(deprecated)<frame/><iframe>...</iframe><object/><iframe>src<iframe/>srcdoc<iframe/>longdesc属性HTMLでは、は、、または要素longdesc内で使用される属性です。これは、問題の画像、フレーム、または iframe の詳細な説明を提供するドキュメントへのURL [注 5 ]である必要があります。 [ 63 ]この属性には、よく誤解されるように説明のテキスト自体ではなく、URL が含まれている必要があります。<img/><frame/><iframe>
longdescは、視覚障害者などアクセシビリティに問題のあるコンピュータユーザー向けに画像情報を表示するためにスクリーンリーダーで使用するように設計されており、Web ブラウザとスクリーンリーダーの両方で広く実装されています。[ 64 ]一部の開発者は、[ 65 ]実際にはこの目的で使用されることはほとんどなく、属性を使用する著者は比較的少なく、そのほとんどが誤って使用しているため、非推奨にすることを推奨しています。[ 66 ]出版業界は、 の維持を主張して対応しています。[ 67 ]longdesclongdesc
< img src = "Hello.jpg" longdesc = "description.html" >内容description.html:
<br /> <p>これは2段重ねのバースデーケーキの画像です。</p> ... グラフィカルブラウザでリンクをネイティブに表示できるものは非常に少ないため(OperaとiCabは例外)、可能な限り要素の近くに説明ページへのリンクを含めることが有効です。これは視覚障害のないユーザーにも役立ちます。<img/>
< img src = " Hello.jpg " longdesc = " description.html " / > [ <a href="description.html" title="画像の詳細な説明"> D </a> ]
以下の要素は、ティム・バーナーズ=リーが1989年から1991年にかけて開発した初期のHTMLの一部でした。これらはHTMLタグで言及されていますが、HTML 2.0で非推奨となり、HTML標準の一部にはなりませんでした。
<listing>...</listing>(deprecated)<plaintext>(deprecated)<plaintext>マークアップを終了し、残りのドキュメントがプレーンテキストであるかのように解析されるため、終了タグはありません。<plaintext>HTMLタグに存在していた。HTML 2.0で非推奨となり、HTML 4.0では無効となった。<xmp>...</xmp>(deprecated)<nextid>(deprecated)<nextid>HTMLタグに存在していた(廃止されたと説明されている)。HTML 2.0で非推奨となり、HTML 3.2以降では無効になった。このセクションでは、広く使われているものの現在は廃止されている要素をいくつか紹介します。つまり、これらは有効なコードでは使用されていません。また、すべてのユーザーエージェントでサポートされているとは限りません。
<blink>...</blink>(deprecated){text-decoration:blink}<blink>Netscape Navigatorで誕生し、 Firefoxをはじめとする後継ブラウザで広く認識されています。HTML 2.0以降では非推奨または無効となっています。代替となるCSSタグは標準規格ですが、サポートは必須ではありません。<layer>...</layer>(deprecated)<layer>Netscape 4で初めて登場。HTML 4.01以降では非推奨または無効。<marquee>...</marquee>(deprecated)<marquee>Microsoft Internet Explorerで生まれた機能。HTML 4.01以降では非推奨または無効。<nobr>...</nobr>(deprecated){white-space:nowrap;}<nobr>は、互換性のためにほとんどのブラウザで認識される独自の要素ですが、HTML 2.0以降では非推奨または無効になっています。<noembed>...</noembed>(deprecated)<embed><object><!-- A Comment -->HTML(および関連するXML、SGML、SHTML)のコメントは、ドキュメントタイプに応じて、SGMLコメントまたはXMLコメントと同じ構文を使用します。
ほとんどの HTML タグとは異なり、コメントはネストされません。より一般的には、コメントテキストに表示できない文字列がいくつかあります。それらは<!--、(コメントの開始)、-->(これはコメントを終了するので、コメント内に表示できないことは自明です)、およびです--!>。さらに、文字列>と は->コメントの開始に表示できず、文字列の<!-末尾に表示できません。[ 71 ]
その結果、マークアップは<!--Xbegin<!--Y-->Xend-->不正な形式となり、次のコメントが生成されます。Xbegin < !--YそしてテキストXend-- >その後、または時にはただXend-- >ブラウザによって異なります。
コメントはドキュメント内のどこにでも記述できます。HTML パーサーは、他の HTML タグ構造内にない限り、どこに記述されていてもコメントを無視するはずです (つまり、属性や値の隣で使用することはできません。これは無効なマークアップです: )。<span id="x1"<!--for "extension one"-->style="...">
コメントはDOCTYPE宣言の前にも記述できますが、他のタグではそのような記述は許可されていません。
しかし、すべてのブラウザやHTMLエディタがHTML構文フレームワークに完全に準拠しているわけではなく、構文によっては予期しない動作をする場合があります。コメントの処理に不具合が生じるのは、使用されているブラウザやHTMLエディタ全体の約5%に過ぎず、しかも特定のバージョンのみがコメント処理の問題の影響を受けています(この高い割合の大部分はInternet Explorer 6によるものです)。
コメントに関しては、いくつか互換性上の注意点があります。
doctypeを使用します。そのため、情報は一切処理されません。doctype<style><script><--[script]...[/script] --><style>...{commenttags}...</style><embed><embed>フレームは、特にスクリーンリーダーを使用する障害のあるユーザーにとって特有の追加のユーザビリティ上の課題をもたらします。