Heim >Web-Frontend >HTML-Tutorial >Was sind die Inline-Elemente und Inline-Elemente von HTML? Einführung in die Eigenschaften von HTML-Inline-Elementen und Inline-Elementen
Was sind die Inline-Elemente von HTML? Was sind die Elemente in einem HTML-Block? In diesem Artikel werden Inline-Elemente und Elemente auf Blockebene sowie deren Eigenschaften und Unterschiede vorgestellt.
Eigenschaften von HTML-Inline-Elementen:
Inline-Elemente werden auch Inline-Elemente oder eingebettete Elemente genannt. Inline-Elemente und andere Elemente befinden sich alle in derselben Zeile und Höhe, Zeilenhöhe, Abstand und Ränder können nicht geändert werden. Die Breite entspricht der Breite des Texts oder Bilds und kann nicht geändert werden. Inline-Elemente können nur Text oder andere Inline-Elemente enthalten.
Die im vorherigen Artikel erwähnten a, img, br sind Inline-Elemente.
Eigenschaften von Blockelementen:
① beginnt immer in einer neuen Zeile;
② Höhe, Zeilenhöhe sowie Ränder und Abstand können gesteuert werden;
③Die Standardbreite beträgt 100 % des Containers, sofern keine Breite festgelegt ist.
④Es kann Inline-Elemente und andere Blockelemente aufnehmen.
Eigenschaften von Inline-Elementen:
① und andere Elemente befinden sich in derselben Zeile;
② Höhe, Zeilenhöhe sowie äußere und innere Ränder Der Abstand kann nicht sein geändert;
③Die Breite ist die Breite des Texts oder Bildes und kann nicht geändert werden
④Inline-Elemente können nur Text oder andere Inline-Elemente aufnehmen.
Hinweis zu Inline-Elementen und Blockelementen:
Gemäß der CSS-Spezifikation verfügt jedes Webseitenelement über ein Anzeigeattribut wird verwendet, um den Typ des Elements zu bestimmen. Beispielsweise hat ein div-Element den Standard-Anzeigeattributwert „Block“ und wird zum Standard-Anzeigeattribut Der Wert des span-Elements ist „inline“, was als „inline“-Element bezeichnet wird. Elemente auf Blockebene wie „div“ belegen automatisch einen bestimmten rechteckigen Raum. Das Erscheinungsbild dieses Rechtecks kann durch Festlegen von Attributen wie „Höhe“, „Breite“ und „Innen- und Außenränder“ angepasst werden. und „a“ Elemente haben keinen eigenen unabhängigen Raum. Sie sind an andere Elemente auf Blockebene gebunden. Daher ist das Festlegen von Attributen wie Höhe, Breite sowie innere und äußere Ränder für Inline-Elemente ungültig.
Der Unterschied zwischen Inline- und Blockelementen:
(1) Elemente auf Blockebene belegen eine exklusive Zeile und ihre Breite füllt automatisch die Breite ihrer aus übergeordnetes Element
Benachbarte Inline-Elemente werden nicht in derselben Zeile angeordnet. Sie werden nicht umgebrochen, bis eine Zeile nicht mehr passt
(2). Unter normalen Umständen können Elemente auf Blockebene die Breiten- und Höhenattribute festlegen, und die Breite und Höhe von Inline-Elementen sind ungültig
(Hinweis: Auch wenn die Breite eines Blocks (3) Elemente auf Blockebene können den horizontalen Abstand links, den Abstand rechts, den linken Rand und den rechten Rand festlegen Alle Inline-Elemente erzeugen Randeffekte, aber die vertikalen Auffüllungen oben und unten erzeugen weder Randoberseite noch Randunterseite Randeffekte. (Die horizontale Richtung ist gültig, die vertikale Richtung ist ungültig)
Was sind Zeilenelemente und Blockelemente:Blockelement (Blockelement)
Adresse – Adresse
Blockquote – Blockzitat
Mitte – Ausrichtungsblock
dir – Verzeichnisliste
div – gemeinsamer Block Level ist einfach und es ist auch das Haupt-Tag des CSS-Layouts
dl – Definitionsliste
fieldset – Formularkontrollgruppe
form – interaktives Formular
h1 – Überschrift
h2 – Untertitel
h3 – Überschrift der Ebene 3
h4 – Überschrift der Ebene 4
h5 – Überschrift der Ebene 5
h6 – Kopfzeile der Ebene 6
hr – horizontale Trennlinie
menu – Menüliste
noframes – rahmt optionalen Inhalt ein (zeigt diesen Blockinhalt für Browser an, die dies nicht tun). Unterstützungsrahmen
noscript – optionaler Skriptinhalt (zeigt diesen Inhalt für Browser an, die kein Skript unterstützen)
ol – Sortierform
p – Absatz
pre – Formatierter Text
able – Tabelle
ul – Unsortierte Liste
Inline-Element (Inline-Element)a – Anker
abbr – Abkürzung
Akronym – Erstes Wort
b – Fett (nicht empfohlen)
big – Große Schriftart
br – Zeilenumbruch
zitieren – Zitat
Code – Computercode (erforderlich beim Zitieren von Quellcode)
dfn – Definitionsfeld
em – Hervorhebung
Schriftart – Schriftarteinstellung (nicht empfohlen)
i – kursiv
img – Bild
Eingabe – Eingabefeld
kbd – Tastaturtext definieren
label – Tabellenbezeichnung
q – kurzes Anführungszeichen
s – Unterstrich (nicht empfohlen)
samp – Beispiel-Computercode definieren
select – Elementauswahl
small – Kleiner Schrifttext
span – Häufig verwendete Inline-Container, Blöcke im Text definieren
strike – unterstrichen
strong – fett Hervorhebung
sub – tiefgestellt
sup – hochgestellt
textarea – mehrzeiliges Texteingabefeld
tt – Telextext
u - unterstreichen
var - Variablen definieren
【Verwandte Empfehlungen】
HTML5 Was ist HTML5 und was sind die Funktionen, Vor- und Nachteile von HTML5?Grundlegende Elemente von HTML, damit Sie HTML von Grund auf lernen können
Das obige ist der detaillierte Inhalt vonWas sind die Inline-Elemente und Inline-Elemente von HTML? Einführung in die Eigenschaften von HTML-Inline-Elementen und Inline-Elementen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!