読者です 読者をやめる 読者になる 読者になる

Bye Bye Moore

猫マンション建築の野望を胸に零細事業主として資本主義の荒波に漕ぎ出したアラサー男の技術メモ

HTMLファイルにインラインのSVGを入れる

HTMLファイルにインラインのSVGを入れる事ができます。
わざわざ別ファイルに分けるようなモノでも無いときはこの手もアリですね。

<!DOCTYPE html>
<html>
  <head>
    <title>Simple SVG Test</title>
  </head>
  <body>
    <svg version="1.1"
	 baseProfile="full"
	 width="300" height="200"
	 xmlns="http://www.w3.org/2000/svg">

      <rect width="100%" height="100%" fill="blue" />
      <circle cx="150" cy="100" r="80" fill="green" />
      <text x="150" y="125" font-size="60" text-anchor="middle" fill="white">SVG</text>
    </svg>

  </body>
</html>

こんな画面が出ます。
f:id:shuzo_kino:20160607225047p:plain