So verwenden Sie benutzerdefinierte Tags in HTML

Benutzerdefinierte Tags können in XML- und HTML-Dateien beliebig verwendet werden. Dabei sind jedoch einige Dinge zu beachten:
Das xmlns-Attribut des <html>-Tags muss gesetzt werden. Sie können es beispielsweise folgendermaßen deklarieren: <html xmlns:article>.
Dies liegt daran, dass HTML-Dateien einen Standard-Namespace haben und Tags wie <div> und <p> sich in diesem Standard-Namespace befinden.
Offensichtlich enthält dieser Standard-„Namespace“ nicht unsere „benutzerdefinierten Tags“, daher können wir nur selbst einen „Namespace“ definieren und die „benutzerdefinierten Tags“ in diesen benutzerdefinierten „Namespace“ einfügen.
Nach meinen Versuchen können benutzerdefinierte Namespaces kein Chinesisch verwenden. Beispielsweise ist die Deklaration: <html xmlns:namespace> falsch. Wenn Sie benutzerdefinierte Tags verwenden, sollten Sie die Form <namespace:benutzerdefiniertes Tag> anstelle von <benutzerdefiniertes Tag> verwenden.
Das heißt, der Name des benutzerdefinierten Tags muss seinen „Namespace“ angeben.
Der Stil eines benutzerdefinierten Tags kann im <style>-Tag oder durch Festlegen seines Stilattributs bei der Verwendung (Inline-Einstellung) festgelegt werden.
Legen Sie im <style>-Tag beispielsweise Folgendes fest:

Code kopieren

Der Code lautet wie folgt:

Beachten Sie, dass Sie beim Festlegen des Stils im <style>-Tag zwischen „Namespace“ und „:“ „\“ hinzufügen müssen. Das Obige wird beispielsweise als article\: article body und nicht als article: article body geschrieben. Wenn Sie ein benutzerdefiniertes Tag verwenden, legen Sie dessen Stilattribut fest, beispielsweise:

Code kopieren

Der Code lautet wie folgt:

<article:Article title style="border:1px solid #ccc;">Dies ist der Titel des Artikels</article:Article title>

Beispiel:

Code kopieren

Der Code lautet wie folgt:

<!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//DE
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd>
<html xmlns:Artikel>
<Kopf>
<meta http-equiv="Inhaltstyp" content="text/html; charset=gb2312" />
<title>Benutzerdefinierte Tags verwenden</title>
<style type="text/css">
Artikel\:Artikeltext{Anzeige:Block;Rahmen:1px durchgezogen #ccc;Hintergrundfarbe:#efefef;Farbe:#00a;}
</Stil>
</Kopf>
<Text>
<article:Artikeltitelstil="Anzeige:Block;Rahmen:1px durchgehend rot;Hintergrundfarbe:#FFF5F4;Textausrichtung:Mitte;Farbe:#f00;">
Hier ist der Titel des Artikels
</article:Artikeltitel>
<Artikel:Artikeltext>
Hier der Haupttext des Artikels
</article:Artikeltext>
</Körper
</html>

Hinweis: Der Standardanzeigewert des benutzerdefinierten Etiketts ist „Inline“. In diesem Beispiel wird er in „Blockanzeige“ geändert.

<<: Erste Schritte mit der Konvertierung von Vue in React

>>: Detaillierte Erläuterung des Ausführungsprinzips des MySQL-Kill-Befehls

Eine kurze Analyse der Unterschiede zwischen Undo, Redo und Binlog in MySQL

So verwenden Sie benutzerdefinierte Tags in HTML

Eine kurze Analyse der Unterschiede zwischen Undo, Redo und Binlog in MySQL

Analysieren Sie mehrere gängige Lösungen für MySQL-Ausnahmen

Native js implementiert Warenkorb-Logik und -Funktionen

Bildschirmbefehl und Verwendung unter Linux

Detaillierte Erklärung der Bedeutung und des Unterschieds zwischen MySQL-Zeilensperren und Tabellensperren

Detaillierte Erklärung des JavaScript-Proxy-Objekts

So isolieren Sie Benutzer in Docker-Containern

Detailliertes Tutorial zum Veröffentlichen von Springboot-Projekten über das Docker-Plugin in IDEA

So erstellen Sie mit virtualenv eine virtuelle Umgebung unter Windows (zwei Möglichkeiten)

Realisierung baumförmiger Sekundärtabellen auf Basis von Angular

Artikel empfehlen

So konfigurieren Sie https für Nginx in Docker

Die perfekte Lösung für das AutoFill-Problem in Google Chrome

So richten Sie die passwortfreie SSH-Anmeldung beim Linux-Server ein

Nativer JS-Musikplayer

Der Speicherplatz wird in den Browsern IE, Firefox und Chrome unterschiedlich angezeigt

Implementierungs- und Nutzungsszenarien der JS-Anti-Shake-Drosselungsfunktion

Analyse des Unterschieds zwischen absolutem und relativem Pfad in HTML

MySQL Serie 3 Grundlagen

JavaScript Snake-Implementierungscode

Lösung für mobile Browser, die die Position nicht unterstützen: Fix

Node+Express zum Erzielen eines Paging-Effekts

Ein negativer oberer Randwert löst das Problem der vertikalen Zentrierung zwischen Beschriftungstext und Eingabe

.NETCore Docker implementiert Containerisierung und privates Image-Repository-Management

Grafisches Tutorial zur Installation und Konfiguration von MySQL 5.7.17 unter Windows 10

Mehrere Möglichkeiten, Bilder in React-Projekte einzuführen