Heim > Web-Frontend > HTML-Tutorial > Wie unterscheidet man HTML-Elemente? (Beispielzusammenfassung)

Wie unterscheidet man HTML-Elemente? (Beispielzusammenfassung)

藏色散人
Freigeben: 2018-08-14 15:28:23
Original
2510 Leute haben es durchsucht

Dieser Artikel stellt Ihnen hauptsächlich die Definition und Klassifizierung von HTML-Elementen vor (Enzyklopädie der HTML-Elemente). Im Folgenden finden Sie eine Einführung in verwandte Themen wie HTML-Elemente auf Blockebene, Konvertierung von HTML-Elementen auf Blockebene, Blockelemente und Inline-Elemente usw. Dieser Artikel hat einen gewissen Referenzwert und ich hoffe, dass er Freunden in Not hilfreich sein wird. Zunächst muss jeder wissen, was HTML ist.

HTML ist Hypertext Markup Language. HTML-Text ist beschreibender Text, der aus HTML-Befehlen besteht und Text, Grafiken, Animationen, Sounds, Tabellen, Links usw. beschreiben kann. Die Struktur von HTML besteht aus zwei Teilen: Head und Body. Der Header beschreibt die vom Browser benötigten Informationen und der Body enthält den zu erläuternden spezifischen Inhalt.

Spezifische Beispiele für die Grundstruktur von HTML sind wie folgt:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    </head>
    <body>
    <p>body里面就是网页内容</p>
    </body>
    </html>
Nach dem Login kopieren

Tag-Elemente in HTML werden im Allgemeinen in drei verschiedene Typen unterteilt: Elemente auf Blockebene und Inline-Elemente (auch Inline-Elemente genannt) und Inline-Elemente auf Blockebene.

Wie unterscheidet man HTML-Elemente? (Beispielzusammenfassung)

1. Eigenschaften von Inline-Elementen:

Alle in derselben Zeile wie andere Elemente; > 2. Die Höhe, Breite sowie der obere und untere Rand des Elements können nicht festgelegt werden.

3. Die Breite des Elements entspricht der Breite des darin enthaltenen Textes oder Bilds und kann nicht geändert werden.

Was sind die häufig verwendeten Inline-Elemente (d. h. was sind die HTML-Inline-Elemente):

<a>、<span>、<br>、<i>、<em>、<strong>、<label>、<q>
Nach dem Login kopieren

Set display:inline; Sie können Blockelemente in HTML-Inline-Elemente konvertieren


2. Eigenschaften von Elementen auf Blockebene (was bedeutet HTML-Element auf Blockebene):

1. Jedes Element auf Blockebene beginnt in einer neuen Zeile und Nachfolgende Elemente beginnen ebenfalls in einer neuen Zeile.

2. Höhe, Breite, Zeilenhöhe, oberer und unterer Rand des Elements können eingestellt werden.

3. Wenn die Elementbreite nicht festgelegt ist, beträgt sie 100 % des übergeordneten Containers (entspricht der Breite des übergeordneten Elements)

Häufig verwendete Blockelemente sind:

,

,

...

,
    ,
    ,
    , ,
    , < ;blockquote> ,

    Set display:block; Das Element kann in ein Element auf Blockebene umgewandelt werden.

    3. Eigenschaften von Inline-Elementen auf Blockebene: (Hat die Eigenschaften von Inline-Elementen und Elementen auf Blockebene)

    1 Elemente;

    2. Höhe, Breite, Zeilenhöhe, oberer und unterer Rand des Elements können eingestellt werden!

    Häufig verwendete Inline-Blockelemente (das heißt, was sind Inline-Block-Level-Elemente):

    Wie unterscheidet man HTML-Elemente? (Beispielzusammenfassung),

    display:inline-block ; float:left/right; position: absolute/fixed; Sie können das Element auf ein Inline-Block-Level-Element setzen.

    Hinweis: Elemente auf Blockebene und Inline-Elemente belegen standardmäßig immer eine Zeile, Inline-Elemente jedoch nicht.


Das obige ist der detaillierte Inhalt vonWie unterscheidet man HTML-Elemente? (Beispielzusammenfassung). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage