首页 > Web开发 > 详细

html5 SVG

时间:2014-10-26 21:16:47      阅读:346      评论:0      收藏:0      [点我收藏+]

1,SVG是可伸缩矢量图形。含有不同标签<rect>用于创建矩形;<circle>创建圆形;<ellipse>用于创建椭圆;<line>线;<polyline>折线;<polygon>多边形

2,svg <path d="M 250,150 L150,350 L350 350 Z"/>

定义了一条路径,开始于(250px,150px),到达(150px,350px),再到达(350px,350px),最后在(250px,150px)处关闭路径

以下命令 大写表示绝对定位,小写表示相对定位:

  • M = moveto
  • L = lineto
  • H = horizontal lineto
  • V = vertical lineto
  • C = curveto
  • Z = closepath

3,svg <g>

将多个元素组织在一起

4,svg ViewBox

如果svg图形太大或者太小,就可以用ViewBox属性来调整在页面中的显示范围、大小。 <svg width="50cm" height="25cm" viewBox="0 0 2050 1000" > 意思是 svg 图形的 2050px  1000px 范围,显示到 50cm,25cm 的视口, 0  0 是在视口中的起点坐标。

5,enable-background设置可获得背景图片

html5 SVG

原文:http://blog.csdn.net/liu__hua/article/details/40479861

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!