Kann die CSS-Eigenschaft „content' HTML einfügen?

Einfügen von HTML mit der Content-Eigenschaft von CSS: Eine Machbarkeitsanfrage

Die Content-Eigenschaft von CSS bietet eine Möglichkeit, Inhalte zu generieren und diese vor oder nach einem hinzuzufügen Element mithilfe von Pseudoklassen wie :before und :after. Während dieser Ansatz bestimmte Styling-Aufgaben vereinfachen kann, wirft er die Frage auf, ob es möglich ist, HTML-Code anstelle von einfachem Text einzufügen.

Problem:

Ein Entwickler möchte Implementieren Sie das Einfügen von HTML-Code mithilfe der Content-Eigenschaft. Betrachten Sie den folgenden Code:

.header:before {
  content: '<a href="#top">Back</a>';
}

Mit diesem Ansatz besteht das angestrebte Ziel darin, ein -Element mit dem Text „Zurück“ und einem Link zum Seitenanfang zu generieren. Der Entwickler fragt sich jedoch, ob es eine Möglichkeit gibt, dies mit reinem CSS zu erreichen.

Antwort:

Leider ist das Einfügen von HTML-Code mithilfe der Content-Eigenschaft nicht möglich. Gemäß den CSS-Spezifikationen:

„Generierter Inhalt verändert den Dokumentbaum nicht. Insbesondere wird er nicht an den Dokumentsprachenprozessor zurückgegeben (z. B. zum Reparieren).“

Dies bedeutet, dass die Content-Eigenschaft Zeichenfolgenwerte wörtlich behandelt und verhindert, dass sie als Markup interpretiert werden.

Im bereitgestellten Beispiel wird das angegebene CSS mit dem verwendet HTML:

Das obige ist der detaillierte Inhalt vonKann die CSS-Eigenschaft „content' HTML einfügen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!