Pourquoi les balises HTML P ne peuvent-elles pas imbriquer les div ? Il existe également des exemples de styles CSS pour les balises HTML P.

Cet article présente la version avancée de la balise html p Ceux qui n'ont pas vu la version de base de l'article précédent peuvent cliquer sur le lien ci-dessous. Il y a deux points de connaissances importants sur les balises. L'un est de savoir comment utiliser les styles CSS pour contrôler l'utilisation spécifique des balises P. Il existe des exemples pour chacun d'eux. L'autre est la raison pour laquelle les balises HTML P ne peuvent pas être intégrées. Pour une explication détaillée de l'ensemble des divs, j'espère que vous lirez attentivement la

définition de la balise html P et les instructions d'utilisation :

paragraphe. L'élément

crée automatiquement un espace blanc avant et après. Le navigateur ajoute ces espaces automatiquement ou vous pouvez les spécifier dans votre feuille de style.

Attributs html de la balise P :

Pourquoi les balises div ne peuvent-elles pas être imbriquées dans le Balise P en HTML ?

Étude approfondie :

Comprenons d'abord les éléments en ligne en ligne et les éléments de bloc en ligne, car presque tous les éléments HTML Tous les éléments sont soit des éléments en ligne, soit des éléments de bloc.

Le mot in-line a de nombreuses interprétations : inline, inline, inline, line level, etc. Cependant, ils signifient tous la même signification. Ici, nous choisissons le nom habituel - inline.

générera une nouvelle ligne par lui-même, tandis que ne s'enroulera pas. De même, nous pouvons également définir div comme élément en ligne via CSS et définir span comme élément de bloc. cependant, nous ne pouvons pas les convertir arbitrairement en HTML. Les éléments de bloc peuvent contenir des éléments en ligne ou certains éléments de bloc (l'exemple ci-dessus est en fait une mauvaise utilisation --->J'ai mis

dans

à l'intérieur), mais des éléments en ligne. ne peut pas contenir d'éléments de bloc. Il ne peut contenir que d'autres éléments en ligne. Regardez à nouveau ceci :

où

est un élément de bloc et incorrect pour que

contienne . De même,

peut contenir

, et il est également correct que

suivant, c'est faux, car les éléments en ligne ne doivent pas contenir d'éléments de bloc :

    <p>测试一下块元素与<span>内联元素</span>的差别</p>
    <p>测试一下<div>块元素</div>与内联元素的差别</p>

Il existe également des cas où certains éléments de bloc ne peuvent pas contenir d'autres éléments de bloc. Par exemple :

<h2>我喜欢在<a href="http://www.php.cn/ " >php中文网</a>讨论Web标准的原因。</h2>

Et ça va.

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

Pourquoi ? Parce que la DTD que nous utilisons stipule que les éléments de niveau bloc ne peuvent pas être placés à l'intérieur de

, et que certains navigateurs tolèrent cette écriture :

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

Ceci est le début d'un paragraphe

   <ul>
         <li><p>这样是可以的</p></li>
    </ul>

C'est le début d'un autre paragraphe

Lorsqu'une balise

n'est pas terminée, elle se terminera lorsqu'elle rencontrera l'élément de bloc suivant. En fait, le navigateur les traite ainsi. :

Donc la méthode d'écriture à l'instant deviendra comme ceci :

Texte de test

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

C'est la même chose comme raison pour laquelle il n'est pas raisonnable de mettre

à l'intérieur de

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

Quels éléments de bloc ne peuvent pas être placés à l'intérieur de quels éléments de bloc ? Je sais que vous avez cette question, et je sais qu'il est difficile pour vous de vous en souvenir si je fais juste une liste. Nous pouvons d'abord diviser à nouveau tous les éléments de bloc en plusieurs niveaux. Nous savons déjà que se trouve dans la couche la plus externe et que le niveau suivant de ;frameset>, , et nous savons déjà que les éléments visuels n'apparaîtront que dans , nous mettons donc au premier niveau, puis les éléments imbriqués non libres sont placés au troisième niveau. , et d'autres sont placés au deuxième niveau. <p></p>Les éléments dits qui ne peuvent pas être librement imbriqués sont ceux qui ne peuvent contenir que des éléments en ligne. Ils incluent : les balises de titre <h1>, <h2>, <h3>, <h4> <h5>, <h6>, <caption>; la ligne de séparation <hr> de la marque de paragraphe et un élément spécial <dt> ; sous-niveau). <p></p> <p>Notes de compatibilité</p> <p></p>Dans HTML 4.01, l'attribut align de l'élément p est obsolète dans la DTD stricte XHTML 1.0, l'attribut align de l'élément p ne l'est pas ; soutenu. <p><strong>Veuillez utiliser CSS à la place. </strong></p>Syntaxe CSS : <p></p> <p></p> <p>html Exemple de style CSS pour la balise P : </p><pre class="brush:html;toolbar:false">&lt;p style=&quot;text-align:right&quot;&gt;</pre><p><span style="font-size: 16px;">1." text- "gauche", "texte-droite", "texte-centre" attributs contrôle<p>position du contenu de l'étiquette<strong><pre class="brush:html;toolbar:false"> &lt;p class=&quot;text-left&quot;&gt;在左&lt;/p&gt; &lt;p class=&quot;text-right&quot;&gt;在右&lt;/p&gt; &lt;p class=&quot;text-center&quot;&gt;居中&lt;/p&gt;</pre><p>2.“ text-lowercase ”、“ text-uppercase ”、“ text-capitalize ”属性控制</p> <p>标签英文内容的大小写 </p><pre class="brush:html;toolbar:false"> &lt;p class=&quot;text-lowercase&quot;&gt;hahahahhahahaha都小写&lt;/p&gt; &lt;p class=&quot;text-uppercase&quot;&gt;hahahahhahahaha都大写&lt;/p&gt; &lt;p class=&quot;text-capitalize&quot;&gt;hahahahhahahaha首字母大写&lt;/p&gt;</pre><p>3.字体：“text-muted ”、“text-info ”、“text-success ”、“text-warning ”、“text-primary ”、“text-danger ”等属性，对不同情况下的内容进行不同颜色的标注</p><pre class="brush:html;toolbar:false"> &lt;p class=&quot;text-muted&quot;&gt;text-muted&lt;/p&gt; &lt;p class=&quot;text-info&quot;&gt;text-info&lt;/p&gt; &lt;p class=&quot;text-success&quot;&gt;text-success&lt;/p&gt; &lt;p class=&quot;text-warning&quot;&gt;text-warning&lt;/p&gt; &lt;p class=&quot;text-primary&quot;&gt;text-primary&lt;/p&gt; &lt;p class=&quot;text-danger&quot;&gt;text-danger&lt;/p&gt;</pre><p>4.背景：“bg-muted ”、“bg-info ”、“bg-success ”、“bg-warning ”、“bg-primary ”、“bg-danger ”等属性，对不同情况下的内容进行不同颜色背景的标注</p><pre class="brush:html;toolbar:false"> &lt;p class=&quot;bg-muted&quot;&gt;bg-muted&lt;/p&gt; &lt;p class=&quot;bg-info&quot;&gt;bg-info&lt;/p&gt; &lt;p class=&quot;bg-success&quot;&gt;bg-success&lt;/p&gt; &lt;p class=&quot;bg-warning&quot;&gt;bg-warning&lt;/p&gt; &lt;p class=&quot;bg-primary&quot;&gt;bg-primary&lt;/p&gt; &lt;p class=&quot;bg-danger&quot;&gt;bg-danger&lt;/p&gt;</pre><p>点击这里查看p标签的基础学习文章：<a href="http://www.php.cn/div-tutorial-409056.html" target="_blank"><span style="color: rgb(0, 0, 0); font-family: " helvetica neue sc tahoma arial sans-serif>html<p>标签是什么元素？关于html p标签的定义和作用详解</p></span></a></p> <p>【小编的相关推荐】</p> <p><a href="http://www.php.cn/div-tutorial-408951.html" target="_blank">html dir标签是干啥的？<dir>标签的具体定义和属性介绍</dir></a><br></p> <p><a href="http://www.php.cn/div-tutorial-408952.html" target="_blank">html noscript标签是什么意思？关于noscript标签的用法你了解多少？</a><br></p></strong></p></span></p> </dt> </caption> </h6> </h5> </h4> </h3> </h2> </h1>

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!