HTMLのPタグにDIVタグを含めることができないのはなぜですか?

概要:

1. ブロック要素には インライン要素 または特定のブロック要素を含めることができます (上記の例は実際には間違った使用法です--->e388a4556c0f65e1904146cc1a846bee を内部に配置しました) e388a4556c0f65e1904146cc1a846bee) ただし、インライン要素にブロック要素を含めることはできません。含めることができるのは、他のインライン要素のみです

2、。DTD では、ブロックレベルの要素を次のように規定しています。 e388a4556c0f65e1904146cc1a846bee

3. 重要なポイント: 3 つのレベルのブロック要素

4. inline 要素の img 要素と input 要素は特殊です。 W3C では、インライン要素にはない幅と高さを持っています。要素を display:inline-block に設定すると、置換要素の効果がシミュレートされます。

原因: プロジェクトの作業中に、元々 DW で正しいコードが MyEclipse6.0 にあることがわかりました。 しかし、多くのエラーが表示され、非常に驚​​きました。そこで理由を調べたところ、ブロックレベル要素 P 内で p をネストできないことがわかりました。

さらに深い研究: HTML のほとんどすべての要素はインライン要素またはブロック要素であるため、まずインライン要素とブロックライン ブロック要素について理解しましょう。

インラインという言葉には、インライン、インライン、インライン、ラインレベルなど、さまざまな解釈があります。ただし、ここでは、慣習的な名前であるインラインユニオンを選択します。

まず、以下の例を見てください。そうすれば、この 2 つの違いを理解できるでしょう:

e388a4556c0f65e1904146cc1a846beeブロック要素と 45a2772a6b6107b401db3c9b82c049c2インライン要素54bdf357c58b8a65c66d7c19c8e4d114 の違いをテストします。 0cba36f12cf561cef14ffa62bcdafa2c

e388a4556c0f65e1904146cc1a846beee388a4556c0f65e1904146cc1a846beeブロック要素94b3e26ee717c64999d7867364b1b4a3とインライン要素94b3e26ee717c64999d7867364b1b4a3

効果は次のとおりです。

上記ではたとえば、e388a4556c0f65e1904146cc1a846bee は単独で新しい行を生成しますが、これは CSS レンダリングを行わない場合のみであり、span を次のように定義することもできます。ただし、HTML ではブロック要素を任意に変換することはできません。ブロック要素にはインライン要素または特定のブロック要素を含めることができます (上記の例は実際には間違った使用法です---> e388a4556c0f65e1904146cc1a846bee の中に e388a4556c0f65e1904146cc1a846bee を入れています)。

ただし、インライン要素にはブロック要素を含めることはできません。含めることができるのは他のインライン要素のみです

、もう一度見てください:

<h2>我喜欢在<a href="#" >经典论坛</a>讨论Web标准的原因。</h2>

ここで、c1a436a314ed609750bd7c7d319db4da はブロック要素です。 3499910bf9dac5ae3c52d5ede7383485 を含む c1a436a314ed609750bd7c7d319db4da にも問題はありません。 e388a4556c0f65e1904146cc1a846bee を含む場合も同様です。以下は、インライン要素にブロック要素を含めるべきではないため、これは間違いです:

<a href="#"> <h2>这样是错误的用法！</h2></a>

一部のブロック要素に他のブロック要素を含めることができない場合があります。例:

<p>测试文字
<ul>
<li>现阶段是不能这样用的，要等到XHTML 2.0才可以这样用。</li>
</ul>
测试文字
</p>

これで大丈夫です。

りー

なぜですか？なぜなら、私たちが使用する DTD では、ブロックレベルの要素を e388a4556c0f65e1904146cc1a846bee 内に配置できないと規定しており、一部のブラウザーではそのような記述が許容されているからです。

<p>这是一个段落的开始
<p>这是另一个段落的开始

当一个e388a4556c0f65e1904146cc1a846bee签还没结束时，遇到下一个块元素就会把自己结束掉，其实浏览器是把它们处理成这样：

<p>这是一个段落的开始</p>
<p>这是另一个段落的开始</p>

所以刚才那样的写法会变成这样：

<p>测试文字</p>
<ul>
<li>现阶段是不能这样用的，要等到XHTML 2.0才可以这样用。</li>
</ul>
测试文字<p></p>

这也是跟刚才说第一个例子中e388a4556c0f65e1904146cc1a846bee里面放e388a4556c0f65e1904146cc1a846bee不合理是同一个道理。

以下为重点理解部分：

那哪些块元素里面不能放哪些块元素呢？我知道你有这个疑问，也知道我仅仅列一张清单你不好记住它们。我们可以先把所有的块元素再次划分成几个级别的，我们已经知道100db36a723c770d327fc0aef2ce13b1是在最外层，100db36a723c770d327fc0aef2ce13b1下一级里面只会有8cea2e99ba256aa9b779f5ab5949ca21、6c04bd5ca3fcae76e30b72ad730ca86d、f900b4fc197b16ab214eecf015bb6bd2、37f861bd36cef5b6406eba87d20a5bab，而我们已经知道了可视的元素只会出现在6c04bd5ca3fcae76e30b72ad730ca86d里，所以我们把6c04bd5ca3fcae76e30b72ad730ca86d划在第一个级里面，接着，把不可以自由嵌套的元素划在第三个级，其他的就归进第二个级。所谓的不可自由嵌套的元素就是里面只能放内联元素的，它们包括有：标题标记的4a249f0d628e2318394fd9b75b4636b1、c1a436a314ed609750bd7c7d319db4da、684271ed9684bde649abda8831d4d355、3f7b3decd2dcafb07b84d2d3985d9f40、39318b6f72ed39310530dfd69d0078e1、4e9ee319e0fa4abc21ff286eeb145ecc、63bd76834ec05ac1f4c0ebbeaafb0994；段落标记的e388a4556c0f65e1904146cc1a846bee；分隔线f32b48428a809b51f04d3228cdf461fa和一个特别的元素73de882deff7a050a357292d0a1fca94(它只存在于列表元素5c69336ffbc20d23018e48b396cdd57a的子一级)。

为什么说第二级的元素可以自由嵌套呢？我们可以把它们看成是一些容器（或者说是盒子）， 这些容器的大小可以自由变化，例如我们可以把ff6d136ddc5fdfeffaf53ff6ee95f185嵌在e388a4556c0f65e1904146cc1a846bee里面，也可以把e388a4556c0f65e1904146cc1a846bee嵌在25edfb22a4f469ecb59f1190150159c6里面。

HTML には、ff6d136ddc5fdfeffaf53ff6ee95f185、c34106e0b4e09414b63b2ea253ff83d6、5c69336ffbc20d23018e48b396cdd57a、f5d188ed2c074f8b944552db028f98a1 という特殊な要素がいくつかあり、そのサブレベルは、指定された要素、ff6d136ddc5fdfeffaf53ff6ee95f185、< の子レベルである必要があります。 ;ol> は

である必要があります;

の子レベルは または である必要があります。 06669983c3badb677f993a8c29d18845、92cee25da80fac49f6fb6eec5fd2c22a など、次のサブレベルは a34de1251f0d9fe1e645927f19a896e8 でなければなりません (a34de1251f0d9fe1e645927f19a896e8 は ae20bdd317918ca68efdc799512a9b39、06669983c3badb677f993a8c29d18845、92cee25da80fac49f6fb6eec5fd2c22a にのみ存在します)。 b6c5a531a458a2e790c1fd6421739d1c または b4d429308760b6c2d20d6300079ed38e でコンテンツを配置できます。

これは、多くの人が W3C 検証に合格しない理由でもあります。> ただし、エラー ラベルを e388a4556c0f65e1904146cc1a846bee または 45a2772a6b6107b401db3c9b82c049c2 に変更すると合格できません。これは、検証のための盲目的な検証です。e388a4556c0f65e1904146cc1a846bee は神ではありません。e388a4556c0f65e1904146cc1a846bee は semantic タグを置き換えることはできません。

実際、インライン要素の中にはまだ区別することができます 特別な要素 (a1f02c36ba31691bcfe87b2722de723b、d5fd7aea971a85678ba271703566ebfd など) がいくつかあり、それらは定義できます。幅と高さ。 IEですが ブラウザでは、すべての要素で幅と高さを定義できますが、これは IE 独自の標準であり、すべてのブラウザがサポートしているわけではありません。W3C ではこれらを置換要素と呼んでいます。翻訳に適した単語が見つかりません。これらはインラインに属しますまた、「表示: inline-block の応用」で説明した inline-block には、他の要素を置換要素としてシミュレートできる機能もあります。当面は、それについて詳しく知る必要はありません。 、それを学ぶのは後で待ってください。

以上がHTMLのPタグにDIVタグを含めることができないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。