如何在没有html

时间:2018-12-14 07:33:47

标签: javascript html css svg

我有一个svg文件,我使用javascript使用DrawImage函数在画布上绘制图像。 我想知道我是否可以在svg文件中使用外部CSS文件。 我找不到有关未嵌入或未使用svg文件作为图像的外部css文件的任何信息。

我发现了,但是没用。

<?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;
}

1 个答案:

答案 0 :(得分:1)

我正在使用类似这样的东西:

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

使用@import的外部CSS文件

 <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部分是可选的。