Как включить файл CSS в SVG-файл без HTML

Question

У меня есть файл SVG, и я использую JavaScript для рисования изображения на холсте, используя функцию DrawImage.Мне интересно, могу ли я использовать внешний файл CSS в моем файле SVG.Я не могу найти что-либо об использовании внешнего файла CSS без встраивания или без использования файла SVG в качестве изображения.

Я нашел это, но это не сработало.

<?xml version="1.0" encoding="utf-8"?>
<?xml-stylesheet type="text/css" href="Style.css" ?>
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 width="453.96px" height="660.7px" viewBox="0 0 453.96 660.7" enable-background="new 0 0 453.96 660.7" xml:space="preserve">

<g id="Wind">
....
</g>

#Wind{
  fill: blue;
  width: 100px;
  color:blue;
}

Answer 1

Я использую что-то вроде этого:

 <svg . . . . >
  <style type="text/css">
        <![CDATA[
        circle {
          fill: red;
        }
        ]]> 
  </style>
  <circle . . . . />
  </svg>

Внешний файл CSS, используя @ import

 <svg . . . .>
  <style>
        @charset "UTF-8";
        @import url(estilosSVG.css);
        rect{fill:#6ab150;}
      </style>
      <rect .../>
  </svg>

Если вы не хотите использовать @import:

<?xml-stylesheet type="text/css" href="style.css" ?>
  <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
  <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
  ...................................

Часть DOCTYPE необязательна.