Gibt es einen Unterschied zwischen <div /> und <div></div>?

Question

Ich bin auf ein Problem auf meiner Webseite gestoßen, bei dem der Footer auf der Master-Seite für eine bestimmte Seite nicht richtig angezeigt wurde. Auf dieser Seite hatte ich eine

am Ende.

Nachdem ich eine Weile überlegt hatte, sah ich, dass ich nur diese Zeile ändern musste, um den Footer richtig anzeigen zu lassen:

Ich verstehe nicht, warum es einen Unterschied machen sollte, es auf diese Weise zu schreiben. Sind sie nicht semantisch äquivalent? Ich habe überprüft und doppelt überprüft, dass dies die einzige Änderung war, die ich vorgenommen habe. Das Hin- und Herschalten zwischen den beiden änderte das Verhalten des Footers.

Also frage ich mich... sind sie nicht äquivalent? Was ist der Unterschied zwischen ihnen?

Bearbeitet: Das Seltsame ist, dass sie beide das tun, was ich mit dem darüber liegenden Inhalt möchte. Ich meine, im Fall des selbstschließenden div-Tags, wenn ich ihn komplett entferne, reagiert die Seite definitiv, also muss er IRGENDWAS damit tun und es nicht einfach komplett ignorieren.

Answer 1

Ist kein gültiges Markup. Ein selbstschließendes Tag ist nicht erlaubt.

Sie müssen die vollständige Version

verwenden.

Ein selbstschließendes div-Tag würde keinen Sinn ergeben, da es zu einem leeren div führen würde. Ein leeres div wird in der Regel von den meisten Browsern nicht gerendert.

Answer 2

Gemäß dem HTML 4.01 Spezifikation, Abschnitt 7.5.4 ("Gruppierungselemente: die DIV und SPAN Elemente"):

Start-Tag: erforderlich, End-Tag: erforderlich

Ein selbstschließendes

Tag (wie im ersten von Ihnen angegebenen Beispiel:

) ist nicht gültig.

Answer 3

Wenn ich mich richtig erinnere -

ist ungültig. Verwenden Sie, wenn Sie möchten, dass es überall funktioniert. Das Schließen-Tag ist erforderlich, daher funktionieren Dinge wie

nicht.

Alle Gruppierungselemente verhalten sich gleich. Sie werden das gleiche Verhalten sowohl bei DIV als auch bei SPAN sehen.

EDIT: Habe diesen Link gefunden, während ich den Link in der Antwort von @Donut angesehen habe - es handelt sich um eine Matrix, die zeigt, welche Elemente eine optionale Schließ-Tag-Anforderung haben (unter anderem). Sah interessant aus, also dachte ich, ich würde es hier teilen, um es mit allen anderen zu teilen.

Answer 4

Es hängt vom DOCTYPE ab, den Sie verwenden.

Für XHTML, das XML ist, sind die beiden Tags äquivalent. Sie signalisieren dies dem Browser, indem Sie einen der folgenden DOCTYPEs als erste Zeile in Ihrer Seite einfügen:

Für HTML 4.01, das ist das, was alle (?) Browser annehmen, wenn kein DOCTYPE vorhanden ist, müssen bestimmte Tags als offene-schließen ausgedrückt werden. Die meisten Block-Level-Tags erfordern dies, einschließlich solcher Nicht-Markup-Tags wie </code>. Wenn Sie die <a href="http://www.htmlhelp.org/reference/html40/alist.html" rel="noreferrer">WDG HTML Dokumentation</a> betrachten, können Sie sehen, ob ein bestimmtes Tag offene-schließen erfordert oder als leeres Tag ausgedrückt werden kann, über den "Syntax" Punkt:</p> <pre><code>Syntax <DIV>...</DIV> </code></pre></x-turndown>

Answer 5

Selbstterminierende Tags sind in XML gültig, aber in diesem Fall nicht für HTML