HTML5 タグのネスト規則_html/css_WEB-ITnose

WBOY
リリース: 2016-06-24 11:19:44
オリジナル
992 人が閲覧しました

× カタログ [1] カテゴリ [2] サブ要素 [3] 概要

前の単語

HTML5 では、<a> 要素のサブ要素をブロックレベルの要素にすることができます。受け入れられないものとみなされるため、ルールを遵守してください。この記事では、html5のタグの入れ子のルールを詳しく紹介します

分類

html5が登場する前は、要素はブロック、インライン、インラインブロックによって区別されることがよくありました。 HTML5 では、要素は表示属性によって区別されるのではなく、コンテンツ モデルによって区別されます。コンテンツ モデルは、メタデータ コンテンツ、セクション化コンテンツ、見出しコンテンツ、ドキュメント フロー (フロー コンテンツ)、ステートメント タイプ (フレージング コンテンツ)、埋め込みタイプ (埋め込みコンテンツ) に分割されます。 )、インタラクティブタイプ(インタラクティブコンテンツ)。どのカテゴリにも属さない要素は浸透していると言われ、複数のカテゴリに属する​​可能性のある要素は混合されていると言われます。

メタデータ要素 (メタデータコンテンツ) は、他のコンテンツのパフォーマンスや動作を記述したり、現在のドキュメントと他のドキュメントの間の接続を確立したりするために使用できる要素です

base link meta noscript script style template title
ログイン後にコピー

フロー要素 (フローコンテンツ) は、アプリケーションやドキュメントの本体で使用されるほとんどの要素です

a abbr address area(如果它是map元素的子元素) article aside audio b bdi bdo blockquote br button canvas cite code data datalist del dfn div dl em embed fieldset figure footer form h1 h2 h3 h4 h5 h6 header hr i iframe img input ins kbd keygen label main map mark math meter nav noscript object ol output p pre progress q ruby s samp script section select small span strong sub sup svg table template textarea time u ul var video wbr text
ログイン後にコピー

ブロック型要素 (セクションコンテンツ) は、ヘッダーとフッターの範囲を定義するために使用される要素です

article aside nav section
ログイン後にコピー

見出し要素 (見出しコンテンツ) は、ブロック/章のタイトルを定義します

h1 h2 h3 h4 h5 h6
ログイン後にコピー

ステートメント要素 (フレーズコンテンツ) は、段落レベルのテキストをマークするために使用される要素です

a abbr area (如果它是map元素的子级) audio b bdi bdo br button canvas cite code data datalist del dfn em embed i iframe img input ins kbd keygen label map mark math meter noscript object output progress q ruby s samp script select small span strong sub sup svg template textarea time u var video wbr text
ログイン後にコピー

埋め込み要素 (埋め込みコンテンツ) ) は、ドキュメント内の他のリソースを参照または挿入する要素です

audio canvas embed iframe img math object svg video
ログイン後にコピー

インタラクティブ要素 (インタラクティブコンテンツ) は、ユーザーとの対話に特に使用される要素です

a audio(如果设置了controls属性) button embed iframe img(如果设置了usemap属性) input(如果type属性不为hidden) keygen label object(如果设置了usemap属性) select textarea video (如果设置了controls属性)
ログイン後にコピー

子要素

【 1】子要素はフロー要素です

<article>、<section>、<blockquote>、<li>、<dd>、<figcaption>、<div>、<main>、<td>
ログイン後にコピー

【1.1】子要素は
要素を除いたフロー要素です

<aside>、<nav>
ログイン後にコピー

【1.2】子要素はフロー要素ですが、 <table> 要素

<caption>
ログイン後にコピー

【1.3】子要素は flow 要素ですが、<form> 要素は含みません

<form>
ログイン後にコピー

【1.4】 子要素は flow 要素ですが、< は含みません;header>、
、< ;main> 要素

<header>、<footer>、<main>
ログイン後にコピー

[1.5] 子要素はフロー要素ですが、
、セクションコンテンツ、見出しコンテンツは含まれません

<dt>、<th>
ログイン後にコピー

【1.6】子要素はフロー要素ですが、
、<address>、セクションコンテンツ、見出しコンテンツは含まれません

<address>
ログイン後にコピー

[1.7] 子要素は < です。 figcaption> 要素の後に flow 要素

<figure>
ログイン後にコピー

[1.8] 子要素は 要素の後に flow 要素

<filedset>
ログイン後にコピー

【2 】 子要素はステートメント型要素

<h1>、<h2>、<h3>、<h4>、<h5>、<h6>、<p>、<pre class="brush:php;toolbar:false">、<em>、<strong>、<small>、<s>、<cite>、<q>、<abbr>、<data>、<time>、<code>、<var>、<samp>、<kbd>、<sub>、<sup>、<i>、<b>、<u>、<mark>、<bdi>、<bdo>、<span>、<input>、<output>、<legend>、<label>
ログイン後にコピー

【2.1】子要素はステートメント型の要素ですが、自身と同じ要素は含まれません

<dfn>、<progress>、<meter>
ログイン後にコピー

【2.2】子要素はステートメント型の要素ですが、インタラクティブな要素は含まれません 要素(インタラクティブコンテンツ)

<button>
ログイン後にコピー

【3】子要素は透明です(親要素が許可する子要素の影響を受けます)

<ins>、<del>、<map>
ログイン後にコピー

【3.1】子要素は透明です(子要素の影響を受けます)親要素で許可されている子要素が優先されます)、ただし、インタラクティブ要素 (インタラクティブ コンテンツ) は含まれません

<a>
ログイン後にコピー

【3.2】子要素は no にすることも、 要素にすることも、透明にすることもできます (親要素で許可されているとおり) サブ要素が優先します)

<object>
ログイン後にコピー

【4】サブ要素なし

<hr>、<br>、<wbr>、<img>、<embed>、<param>、<source>、<track>、<area>、<col>、<keygen>
ログイン後にコピー

【4.1】サブ要素はサブ要素を持つことができません。

  • 要素、または
    人気のチュートリアル
    詳細>
    最新のダウンロード
    詳細>
    ウェブエフェクト
    公式サイト
    サイト素材
    フロントエンドテンプレート