Comment la propriété display de l'élément `` affecte-t-elle le comportement des boîtes de blocage anonymes et le style du contenu qu'elles contiennent ?

display:block Inside display:inline

Considérons le scénario suivant : un document HTML avec un élément stylisé avec display:inline et un

élément stylisé avec display:block. Selon la spécification CSS 2.1, cette configuration donne :

"Une zone de bloc anonyme autour du , contenant une zone de bloc anonyme autour du texte anonyme avant le

, le ."

Visuellement, les boîtes résultantes sont représentées comme :

+- anonymous block box around body ---+
| +- anonymous block box around text 1-+ |
| |                                 + |
| +---------------------------------+ |
|                                     |
| +- P block box -------------------+ |
| |                                 + |
| +---------------------------------+ |
|                                     |
| +- anonymous block box around text 2-+ |
| |                                 + |
| +---------------------------------+ |
+-------------------------------------+

Cependant, le comportement de cette configuration diffère de celle de . Conformément à la spécification CSS 2.1 :

"Les propriétés définies sur les éléments qui provoquent la génération de boîtes de bloc anonymes s'appliquent toujours aux boîtes et au contenu de cet élément."

Cette distinction est visible avec les propriétés comme "style bordure". Dans le cas de , la bordure entourera le texte anonyme avant et après le

élément, laissant l'élément

élément inchangé. En revanche, avec , la bordure entourera tout l'élément body, y compris l'élément

élément.

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!