Anwenden von Stilen auf eingebettete SVGs
Im Gegensatz zu SVGs, die direkt über das
Technische Erklärung
Stylesheets gelten nur innerhalb der Grenzen des Dokuments, in dem sie definiert sind. Eingebettete SVGs werden als separat betrachtet Dokumente, und daher können extern definierte Stile sie nicht beeinflussen.
Lösung: Skriptbasierter Stil Einfügung
Da das
var svgDoc = yourObjectElement.contentDocument;
var styleElement = svgDoc.createElementNS("http://www.w3.org/2000/svg", "style");
styleElement.textContent = "svg { fill: #fff }";
svgDoc.getElementById("where-to-insert").appendChild(styleElement);Dies setzt voraus, dass das
Alternative Ansätze
Direktes CSS Ausrichtung
Wenn die eingebettete SVG-Datei in einer separaten Datei gespeichert wird, können Sie CSS-Stile definieren, die auf Folgendes abzielen
object[data="my-embedded-svg.svg"] {
fill: #fff;
}Dieser Ansatz wendet keine Stile auf das SVG selbst an, kann aber nützlich sein, um das Gesamterscheinungsbild des eingebetteten Elements anzupassen.
Das obige ist der detaillierte Inhalt vonWie kann ich eingebettete SVGs mit dem „'-Tag formatieren?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
Handy-Bildschirm tft
So installieren Sie den PS-Filter
So deaktivieren Sie die sublime automatische Vervollständigung
So richten Sie Textfelder in HTML aus
ps ausgewählten Bereich löschen
So kaufen und verkaufen Sie Bitcoin auf Binance
WeChat-Schritte
Ranking der zehn besten digitalen Währungsbörsen
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
