Servus!
Hallo Matthias,
ich habe mir im Testwiki (weil da Frickl2 ist) mal das Test.svg ins Frickl geladen und dort das foreignObject aus SVG/Element/foreignObject reingezogen.
Es wird nicht angezeigt. Erst, wenn ich das requiredExtensions Attribut rauslösche, kommt es. Das scheint nicht nur unnötig, sondern sogar kontraproduktiv zu sein. Wo kommt das her?
Aus XML. Dort musste man eine Namensraumangabe im svg-Element haben und eben so ein requiredExtensions-Attribut mit Sprachangabe machen, wenn du andere Sachen verwenden willst.
Das war das Code-Beispiel von 2015:
<switch>
<!-- Abspielen eines Sounds und Anzeige eines Textes -->
<!-- wenn die Hyperlink-Erweitungen des Adobe SVG Viewers unterstützt werden -->
<g requiredExtensions="http://www.adobe.com/svg10-extensions">
<a:audio xlink:href="sound64.mp3" begin="0" volume="10" repeatCount="indefinite" />
<text x="100" y="60" text-anchor="middle">Sound in SVG</text>
</g>
<!-- Nur Anzeige eines Textes, im Sonst-Fall -->
<g>
<text x="100" y="60" text-anchor="middle">kein Sound</text>
</g>
</switch>
Mittlerweile (in SVG2) ist das Attribut obsolet.
Das Beispiel im Abschnitt [SVG/Tutorials/Text/mehrzeiliger_Text#HTML_in_SVG] funktioniert mit requiredExtensions-Attribut sowohl im FF131 als auch im aktuellen Edge.
[EDIT] HTML in SVG findet sich jetzt hier:
MathML/Geometrie_mit_MathML, SVG und JavaScript#foreignObject
Ich habe das obsolete requiredExtensions-Attribut aber entfernt. [/EDIT]
Und ich habe dort dann auch versucht, ob ein Chromium-Browser (Edge diesmal) ein style-Attribut akzeptiert. Es steht zwar im DOM, ein class-Attribut steht auch im DOM, ich kann style-Attribut und class über querySelector auch nutzen, aber die Stile werden nicht angewendet.
In diesem Beispiel bleibt das div rot. DIESE Stylerule greift. Von der Spezifität her müsste das style-Attribut höchsten Rang haben, gefolgt von div.foo. Das div sollte also blau oder grün sein. Nö. Nicht in Chromia. In Firefox wird es grün, wenn ich mich recht erinnere (bin jetzt im ERGO Netz, nicht zu Hause, da hab ich keinen FF).
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 100" width="300"> <style> div { color:red; } div.foo { color:green; } </style> <foreignObject x="40" y="40" width="100" height="100"> <body xmlns="https://www.w3.org/1999/xhtml"> <div class="foo" style="color:blue;"> Inhalt </div> </body> </foreignObject> </svg>
Das schau ich mir später in Ruhe an!
Herzliche Grüße
Matthias Scharwies
Was ist eine Signatur?