Gibt es einen semantischen Unterschied zwischen Span- und Div-Werten? [Duplikat]

7

Ich weiß, wenn ich HTML-Code schreibe, sollte ich Semantik im Hinterkopf behalten, zB h1 muss ein Hauptheader sein, h2 muss ein Subheader sein, Tabellen müssen Tabellen sein, verwenden <em> für die Betonung statt <i> , usw. Gibt es einen richtigen Unterschied zwischen divs und spans, außer dass ein Block und der andere in-line ist?

Als ich lernte, wurde mir gesagt, dass <span> für das Styling von Text in der Mitte gedacht war. Wenn ich einen kleinen Textblock hätte, den ich an einem bestimmten Punkt auf meiner Webseite positionieren müsste, der kein <p> -Tag enthält, würde ich einen Bereich verwenden, sollte ich bei div bleiben? Was ist, wenn dieser Text zwei Zeilen umfassen muss (d. H. Er benötigt eine Breite), wenn er nur Text enthält? Was soll ich verwenden?

    
DavidR 02.06.2010, 21:54
quelle

7 Antworten

8

Semantisch hat weder <div> noch <span> irgendeine intrinsische Bedeutung. Sie sind "Catch-All" -Tags, die für Dinge verwendet werden, bei denen kein vorhandenes Tag wirklich passt. Verwenden Sie divs und span als letztes Mittel, wenn Sie Semantik interessieren.

Der einzige Unterschied zwischen ihnen besteht darin, dass divs Elemente auf Blockebene sind und Spannen inline sind. Das heißt, ein div startet standardmäßig einen ganz neuen Block und technisch sind nur Inline-Elemente und bestimmte CSS innerhalb eines Bereichs erlaubt. Die meisten Browser scheinen die Tags unabhängig von den Regeln zu verarbeiten (unter der Annahme von "Tag-Suppe"), und Sie können entweder mit CSS wie die andere fungieren, aber nichts davon tun, wenn Sie Validierung oder browserübergreifende Kompatibilität suchen (Was ist Ihnen wichtig, oder?).

    
cHao 02.06.2010 22:00
quelle
6

Der Hauptunterschied zwischen einer Spanne und einem div besteht darin, dass eine Spanne ein Inline-Element ist, während div ein Blockelement ist, beispielsweise ein p oder ein Absatzelement. Also, im Wesentlichen

%Vor%

Im Wesentlichen werden alle Spannen in divs umgewandelt. Sie verwenden einen Bereich nur für eine Textzeile, wie zum Beispiel Effekte oder Padding oder etwas. Divs sind in der Regel zum Aufteilen Ihrer Webseite, also wenn Sie einen Text irgendwo platzieren müssen, würde ich empfehlen, ein Div zu verwenden.

    
Will 02.06.2010 21:57
quelle
5

Div ist ein Divisionsblock, span ist zum Überspannen von Inline-Text.

So Div ist eine Box / Block mit Höhe und Breite, Spannweite ist inline. Grundsätzlich.

Wenn Sie die Spezifikation lesen möchten, hier ist ein Link. >

  

Die Elemente DIV und SPAN bieten in Verbindung mit den Attributen id und class einen allgemeinen Mechanismus zum Hinzufügen von Struktur zu Dokumenten. Diese Elemente definieren Inhalte als inline (SPAN) oder block-level (DIV), erzwingen aber keine anderen Präsentations-Idiome auf dem Inhalt. Daher können Autoren diese Elemente in Verbindung mit Stylesheets, dem Attribut lang usw. verwenden, um HTML an ihre eigenen Bedürfnisse und Vorlieben anzupassen.

    
Ólafur Waage 02.06.2010 21:57
quelle
3

<span> und <div> sind beide sehr generische Elemente. An sich haben sie keine Bedeutung.

Der Hauptunterschied besteht darin, dass <span> ein Inline-Element ist. Das heißt, wenn Sie etwas haben wie:

%Vor%

Sie haben keinen "anderen Text" in einer neuen Zeile. Wenn Sie die Spannen durch <div> (ein Blockelement) ersetzt haben, wären neue Zeilen vorhanden. Beachten Sie, dass es nicht die richtige Syntax ist, um ein Blockelement in einem Inline-Element zu haben. Daher können Sie <span> in <div> 's haben, aber nicht umgekehrt.

Siehe hier für mehr:

Wikipedia - Span und div

About.com - Span vs. div

    
phsource 02.06.2010 22:00
quelle
2

Es gibt einen grundlegenden Unterschied: <div> ist ein Element auf Blockebene , während <span> ist ein Inline-Element . Der Unterschied besteht darin, dass Elemente auf Blockebene mit Zeilenumbrüchen beginnen und enden und inline sind Elemente nicht.

Vielleicht noch wichtiger ist, dass je nach HTML-Version unterschiedliche Regeln für die Gültigkeit anderer Elemente innerhalb von Block- und Inline-Elementen gelten.

    
Michael Borgwardt 02.06.2010 22:02
quelle
1

Nun, um Ihnen eine schnelle und einfache Antwort zu geben, ist DIV eine Division! Das Ziel ist, es zu verwenden, wenn bestimmte Elemente als Gruppe behandelt werden müssen!

Beispiel: Verwenden Sie ein div, um ein Login-Panel zu haben, sagen wir, versteckt @ auf der linken Seite des Bildschirms, die anzeigen, wenn die Maus das div schwebt:)

    
Zuul 02.06.2010 21:58
quelle
1

Sie haben es. Spanne = Inline, Div = Block. Das ist alles.

Wenn ein Texttext ein eigenes Layout benötigt (Sie möchten es irgendwo auf dem Bildschirm platzieren), dann ist es ein div.

Wenn ein Textblock direkt am Layout des anderen Textes teilnimmt, dann ist es ein Bereich.

Ein Inline-Element kann kein eigenes Layout haben - dann wäre es kein Inline-Element.

    
Matt Brunell 02.06.2010 22:04
quelle

Tags und Links