码迷,mamicode.com
首页 > 其他好文 > 详细

[SVG] Simple introduce for SVG

时间:2016-04-04 01:32:23      阅读:222      评论:0      收藏:0      [点我收藏+]

标签:

Just like create html page, you can create a svg tag by:

<?xml version="1.0" encoding="utf-8"?>
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" height="340" width="340" style="background-color:#F6F7F7;">

</svg>

 

Inside svg,

  • x,y:  control the position of element
  • fill: control the color of element
  • height, width: you know

 

Simple example by rect tag:

<?xml version="1.0" encoding="utf-8"?>
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" height="340" width="340" style="background-color:#F6F7F7;">
    <!-- Chimney -->
    <rect height="21" width="14" fill="#FBF6A7" x="98" y="127"/>
    <rect height="4" width="20" fill="#E04E27" x="95" y="123"/>

    <!-- House -->
    <rect height="84" width="162" fill="#FBF6A7" x="90" y="198"/>
    <rect height="56" width="184" fill="#E04E27" x="80" y="148"/>

    <!-- Door -->
    <rect height="60" width="36" fill="#E04E27" x="153" y="222"/>
    <!-- Door handler -->
    <rect height="8" width="2" fill="#FBF6A7" x="183" y="252"/>
</svg>

 

技术分享

[SVG] Simple introduce for SVG

标签:

原文地址:http://www.cnblogs.com/Answer1215/p/5351274.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!