Vergleichende Analyse von Elementen auf Blockebene und Elementen auf Zeilenebene in HTML

Über Elemente auf Blockebene und Inline-Elemente (Vergleich von Inline-Elementen)

Vergleich der beiden Elemente

Elemente auf Blockebene:

• Es gibt Zeilenumbrüche davor und danach

• Sie können Attribute wie Breite und Höhe sowie Ränder festlegen, siehe Box-Modell

• kann andere Elemente auf Blockebene enthalten, inline. Die Breite des Elements

• ist standardmäßig die Breite des übergeordneten Elements, und die Höhe kann durch die Höhe von festgelegt oder bestimmt werden der Inhalt

Inline-Element:

• Keine Zeilenumbrüche davor und danach

• Festlegen der Breite und die Höhe des Elements ist ungültig. Die Höhe wird durch die Zeilenhöhe bestimmt (wenn nicht festgelegt, wird sie durch die Schriftgröße berechnet), und die Breite wird durch die Menge des Inhalts bestimmt Bei der Breite des übergeordneten Elements wird das Inline-Element auf die nächste Zeile umgebrochen. Für Inline-Elemente können Sie den Abstand, den Rand usw. in horizontaler Richtung festlegen, aber für die vertikale Richtung sieht das Festlegen von Abstand und Rand so aus hat eine Auswirkung, hat jedoch keine Auswirkungen auf den Browser und hat keinen Einfluss auf das Layout anderer Elemente.

• kann keine anderen Elemente

• enthalten, aber einige der Inline-Elemente sind Ersatzelemente (der Browser finalisiert sie basierend auf der Einstellung des Attributs Beim Laden des Erscheinungsbilds können Sie Attribute wie Breite und Höhe festlegen, zum Beispiel: img, input

Konvertierung von Elementen auf Blockebene und Inline-Elementen

• Anzeige festlegen: Block/Inline-Block

• Element auf Float setzen

• Position des Elements festlegen: relativ/ absolut/fest

Weitere Artikel zur vergleichenden Analyse von Elementen auf Blockebene und Elementen auf Zeilenebene in HTML finden Sie auf der chinesischen PHP-Website!