SVG图形编码_html/css_WEB-ITnose
程序员文章站
2022-05-07 11:22:57
...
svg:可以不改变质量的情况下缩放
- svg必须有包含
- 可以绘制不同的形状矩形:rect,圆形:circle,椭圆:ellipse,线:line,折线:polyline,多边形:polygon,路径:path
- 绘制不同的图形则应该使用不同的标签标记如圆形则使用
- 可以将svg保存为svg格式
- x,y表示起始坐标
- fill:填充的颜色,stroke:画的颜色,stroke-width:画的宽度(通俗来讲就是边框)
- 其实和css3的canvas差不多
矩形:rect
圆角矩形:设置rx,ry(圆心的坐标)的值即可
圆形:circle
circle:没有x,y的属性因为已经设置好了圆心cx,cy
椭圆:ellipse
ellipse:椭圆其实就是矩形然后边框是圆角
线段:line(两点确定一条直线)
折线:polyline(就是设置多个坐标点)
注意不能使用(0,0)是无效的
多边形:polygon
当然更复杂的图形,只要知道各个点的坐标即可
路径:path(上面所有的图形 都可以通过path来绘制)
下面的命令可用于路径数据:
注释:以上所有命令均允许小写字母。大写表示绝对定位,小写表示相对定位。
必须按照规则书写
demo: http://2.liteng.sinaapp.com/svg/index.html
原文地址url: http://liteng.org/node/51
上一篇: PHP扩展问题
推荐阅读
-
使用HTML5进行SVG矢量图形绘制的入门教程
-
突袭HTML5之SVG 2D入门2-图形绘制
-
解决Web部署 svg/woff/woff2字体 404错误_html/css_WEB-ITnose
-
html5 canvas 画图形_html/css_WEB-ITnose
-
如何使用SVG生成超酷的页面预加载素描动画效果_html/css_WEB-ITnose
-
html5 canvas 画图形_html/css_WEB-ITnose
-
帮我看一下我的网站字符编码设置的对吗_html/css_WEB-ITnose
-
帮我看一下我的网站字符编码设置的对吗_html/css_WEB-ITnose
-
用CSS代码写出的各种形状图形的方法_html/css_WEB-ITnose
-
前端编码风格规范之 HTML 规范_html/css_WEB-ITnose