Fassen Sie die Unterschiede und die Verwendung von div und span zusammen

Was ist das Span-Tag-Element?

Im HTML-Tag-Element ist das Span-Element ein Inline-Element, also ein Inline-Element. Sein Merkmal ist, dass es keine einzige Zeile einnimmt. Es ist das Gegenteil von Elementen auf Blockebene, die sich in einer eigenen Zeile befinden. Das span-Element hat keine praktische Bedeutung. Es dient lediglich dem Hinzufügen von Stilen 🎜 > Notizen können ihren Inhalt formatieren, indem sie Stile auf span definieren.

Was ist das DIV-Tag-Element?

DIV kann Unterteilungen oder Abschnitte (Unterteilung/Abschnitt) im Dokument definieren.

DIV-Tag kann das Dokument in unabhängige und unterschiedliche Teile unterteilen. Es kann als strenges Organisationstool verwendet werden und verwendet keine damit verbundenen Formatierungen.

Wenn Sie einen DIV mit ID oder Klasse markieren, wird das Tag effektiver. Das div-Tag wird auch zum Erstellen logischer Abschnitte in HTML-Dateien verwendet. Aber im Gegensatz zum Span-Tag, das auf Textblockebene funktioniert, führt es eine Zeilentrennung vor und nach den darin enthaltenen HTML-Elementen ein.

Der folgende Artikel fasst die Verwendung von Span-Tag-Elementen und die Unterschiede zwischen DIV und Span zusammen.

Zunächst können Sie kostenlose Kurse im Zusammenhang mit der chinesischen PHP-Website lernen 1. Lernen Sie

„HTML+ CSS Basic Introductory Tutorial“ 》

in HTML Basic Tutorial – Tag Kapitel

2. Sehen Sie sich

《Dark Horse Programmer HTML Video Tutorial》

Medium Text DIV und Span-Tags Videokurs

Span-Tag-Elementinhalt

1. Einführung in p- und Span-Tags in HTML5

Nur ​​wenn das Ziel Das Element ist sehr eindeutig. Sie sollten die ID nur verwenden, wenn Sie diesen Begriff niemals an anderer Stelle auf der Website verwenden. Mit anderen Worten: Sie sollten die ID nur verwenden, wenn Sie absolut sicher sind, dass dieses Element nur einmal angezeigt wird ein ähnliches Element in der Zukunft, verwenden Sie einfach die Klasse. Die Hauptfunktion des Elements besteht darin, die Elemente in der Zeile zu gruppieren oder zu identifizieren.

2.

Die Lösung für das Problem, das definiert Die Mindesthöhe der Spanne hat keine Auswirkung

Ein Freund hat einmal gefragt: Warum ändern sich Breite und Höhe nach der Verwendung von CSS zum Definieren der Höhe und Breite einer Spanne immer noch nicht, als ob es fehlgeschlagen wäre? ? Tatsächlich ist dieses Problem sehr einfach – Sie müssen zuerst die Eigenschaften von span verstehen, da span ein Inline-Element ist und Inline-Elemente Breite und Höhe ignorieren. Sobald Sie dies verstanden haben, ist die Lösung sehr einfach Verwenden Sie einfach CSS, um span in ein Boxed-Element umzuwandeln.

3.
Was ist die Standardverwendung des Span-Tags in HTML?

Erfüllt es den Standard, Text, Bilder oder andere Dinge in Spannweite zu platzieren?

hat inline-Elemente keine semantische Bedeutung.

Definieren Sie den Inhaltsstil innerhalb eines Absatzes, der sich vom Stil des Absatzes unterscheidet. Sie können Span-Tags für Inhalte verwenden, die die folgenden Bedingungen erfüllen: 2 , wenn Sie einen bestimmten Stil hinzufügen oder einen js-Hook ausführen müssen . DIV-Tag-Elementinhalt

1 DIV-Tag in HTML Wie verwenden

Verwenden Sie CSS-DIV und verlassen Sie sich dabei hauptsächlich auf das Tag

. “, „CSS-Layer“ oder einfach „Layer“.

2. Html5 implementiert das Ziehen und Ablegen von Bildern zwischen zwei DIV-Elementen

Rufen Sie „preventDefault()“ auf Vermeiden Sie die standardmäßige Datenverarbeitung des Browsers (das Standardverhalten des Drop-Ereignisses besteht darin, es als Link zu öffnen) und rufen Sie die gezogenen Daten über die Methode dataTransfer.getData("Text") ab. Diese Methode gibt jeden Datensatz in den gleichen Typ wie in der setData()-Methode zurück. Die gezogenen Daten sind die ID des gezogenen Elements („drag1“). Hängen Sie das gezogene Element an das Platzierungselement (Zielelement) an

3. CSS legt die Transparenz des DIV-Elements fest

Opacity=Start-Deckkraft (es wird nicht transparent sein, wenn es 100 ist)
FinishOpacity=Ende-Deckkraft (es wird nicht transparent sein, wenn es 100 ist)
Style= Stil, beginnend bei 0, 1,2 .3 .... Es gibt einheitliche Transparenz, radiale Formtransparenz ...
StartX = X-Koordinate zum Starten der Transparenz, im Grunde die obere linke Ecke (0) des Bildes und der Ebene
StartY=Y, um die Transparenz zu starten. Die Koordinaten sind im Grunde die obere linke Ecke des Bildes oder der Ebene (0)
FinishX=die X-Koordinate des transparenten Endes, das im Grunde die untere rechte Ecke des Bildes oder der Ebene ist (die Breite des Bildes oder der Ebene)
FinishY=das transparente Ende. Die Y-Koordinate ist im Grunde die untere rechte Ecke des Bildes oder der Ebene (die Höhe des Bildes oder der Ebene)

Der Unterschied und die Verwendung von DIV und SPAN

1. Erklärung des Unterschieds zwischen DIV und Span in HTML

DIV-Tags und SPAN-Tags verarbeiten einige Inhalte als Ganzes, zum Beispiel als Ganzes ausblenden, als Ganzes verschieben. So etwas wie eine Kiste. Dadurch kann der Code rationalisiert und die Effizienz verbessert werden.

DIV fügt den Inhalt in einen rechteckigen Block ein. Das Verschieben nach Belieben wirkt sich auf das Layout aus. Span definiert nur den Inhalt als Ganzes und verwaltet ihn, ohne das Layout und die Anzeige zu beeinflussen.

2. Was ist der Unterschied zwischen DIV und Span? Analyse und Erklärung

Das größte Merkmal von DIV- und SPAN-Elementen ist, dass sie die Objekte innerhalb der nicht formatieren Elemente standardmäßig rendern. Wird hauptsächlich zum Anwenden von Stylesheets verwendet. Der offensichtlichste Unterschied zwischen den beiden besteht darin, dass DIV ein Blockelement ist, während SPAN ein Inline-Element ist (auch als Inline-Element übersetzt).

3. Verstehen Sie den Unterschied zwischen CSS SPAN und DIV

Der Unterschied zwischen SPAN und DIV besteht darin, dass DIV (pision) ein Element auf Blockebene ist, das Absätze enthalten kann , Titel, Tabellen und sogar Dinge wie Kapitel, Zusammenfassungen und Notizen. SPAN ist ein Inline-Element. Es gibt keine Zeilenumbrüche vor und nach SPAN. Es hat keine strukturelle Bedeutung und dient lediglich der Anwendung von Stilen.

Verwandte Fragen und Antworten

1. So überschreiben Sie das importierte CSS mit dem Stil dieses Element-Tags

2. Der Einfluss des Schwebens auf die Spannweitenhöhe

3 dasselbe

4.

So machen Sie ein DIV-Element verschwommen und klar, wenn die Maus nach oben bewegt wird

[Verwandte Empfehlungen]

1 . Kostenloses PHP-Tutorial für die chinesische Website:

„2016 New Curriculum System HTML+CSS“

2. Kostenloses PHP-Tutorial für die chinesische Website:

„HTML-Entwicklungshandbuch“

Das obige ist der detaillierte Inhalt vonFassen Sie die Unterschiede und die Verwendung von div und span zusammen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!