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

So konfigurieren Sie pseudostatisches und clientadaptives Nginx

So verwenden Sie benutzerdefinierte Tags in HTML

So konfigurieren Sie pseudostatisches und clientadaptives Nginx

Detaillierte Schritte zur Installation von rockerChat im Docker und zum Einrichten eines Chatrooms

Installieren Sie Tomcat und stellen Sie die Website unter Linux bereit (empfohlen)

Mac+IDEA+Tomcat-Konfigurationsschritte

CSS Polarkoordinaten Beispielcode

Implementierung einer coolen 3D-Würfeltransformationsanimation in CSS3

Grafisches Tutorial zur Installation und Konfiguration von MySQL 8.0.15

Tiefgreifendes Verständnis der verschiedenen Sperren von MySQL

Lösung für die Baidu-Site-Suche, die https nicht unterstützt (getestet)

Lösung für das Vue-Datenzuweisungsproblem

Artikel empfehlen

SASS Style Programmierhandbuch für CSS

React + ts realisiert den sekundären Verknüpfungseffekt

Vue Router lädt verschiedene Komponenten je nach Hintergrunddaten

JavaScript implementiert Informationen zur Kennwortfeldüberprüfung

Datenbankübergreifende Assoziationsabfragemethode in MySQL

So installieren Sie FastDFS in Docker

Anwendung von Hadoop-Zählern und Datenbereinigung

Natives JS zum Erzielen digitaler Tisch-Spezialeffekte

JavaScript-Countdown zum Schließen von Anzeigen

So unterstreichen Sie das A-Tag und ändern die Farbe vor und nach dem Klicken

Rendern im Vue-Scaffolding verstehen

Detaillierte Erläuterung des Beispiels der Caching-Methode von Vue

Zusammenfassung gängiger Docker-Befehle (empfohlen)

Neue Funktionen in MySQL 8.0 - Einführung in Check Constraints

CSS3 legt eine Maske für das Hintergrundbild fest und löst das Problem der Maskenstilvererbung