How to link to an external CSS style in SVG?
I have a Codepen where I try three different methods of importing an extrenal stylesheet into an SVG. I'm working from the specification which says:
An HTML ‘link’ element in an SVG document (that is, an element in the HTML namespace with local name "link") with its ‘rel’ attribute set to 'stylesheet' must be processed as defined in the HTML specification and cause external style sheets to be loaded and applied to the document.I tried: ● A
<link/>
tag in the <defs/>
section with an xmlns="http://www.w3.org/1999/xhtml"
.
● A <svg>
with a xmlns:html="http://www.w3.org/1999/xhtml"
& containing a <html:link/>
tag.
● A <style>
tag with an @import url()
directive.
Only the last one works, and when I select either of the <link/>
s in the Inspector and console.debug($0.namespaceURI)
, I get http://www.w3.org/2000/svg
.
How do I create a HTML <link/>
tag within a SVG document short of JavaScript?5 Replies
have you tried to use the html namespace?
Where?
I tried it in the
<link/>
as xmlns
& in the <svg/>
as xmlns:html
.also, have you tried to
@import
the css?The
@import
works.if nothing else works, that's the option then
and i have no other ideas