svg的基本图形与属性【小尾巴的svg学习笔记1】
2018-08-02 06:26:08来源:博客园 阅读 ()
因为项目有可能用到, 所以学习了一下,做此笔记,图截自慕课网,侵删。
一、基本图形
1、矩形
x,y定义矩形的左上角坐标;
width,height定义矩形的长度和宽度;
rx,ry定义矩形的圆角半径长度,这里注意,如果rx给值了ry没给值,ry沿用rx的值,反之同理;
2、圆形
cx与cy定义圆心的坐标;
r为圆的半径长度;
3、椭圆
x,y依旧为圆心的坐标;
椭圆相较于圆使半径变为两个值,分别为:rx 横向半径和 ry 纵向半径;
4、直线
这个较为简单,x1,y1为起点坐标,x2,y2为终点坐标
5、折线
points:坐标,折线也较为简单,用空格或逗号间隔,依次写下目标点坐标。
6、多边形(闭合折线)
points:坐标,基本与第五的折线相同,唯一不同的是多边形会把最后一个点和起点连接起来
二、属性
1、fill 填充颜色
2、stork 描边颜色
3、stork-width 描边粗细
4、transform 变形,位移(相较于父亲)等
5、opacity 透明度
6、 fill-opacity 属性定义填充颜色透明度(合法的范围是:0 - 1)
7、 stroke-opacity 属性定义笔触颜色的透明度(合法的范围是:0 - 1)
做得不够详细,下次会进行补充,希望能对大家有一点点帮助。下一个笔记将会描述在代码里的实际应用。
标签:
版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有
上一篇:试图加载格式不正确的程序
下一篇:操作符重载方法
- 前端工程师需要具备哪些基本素质? 2020-04-11
- HTML连载81-CSS书写格式、一个手机页面的基本结构 2020-04-09
- css基本选择器 2020-04-07
- sass常见的基本数据类型+加减乘除基本运算 2020-03-29
- HTML5 基础知识(1)——基本标签 2020-03-10
IDC资讯: 主机资讯 注册资讯 托管资讯 vps资讯 网站建设
网站运营: 建站经验 策划盈利 搜索优化 网站推广 免费资源
网络编程: Asp.Net编程 Asp编程 Php编程 Xml编程 Access Mssql Mysql 其它
服务器技术: Web服务器 Ftp服务器 Mail服务器 Dns服务器 安全防护
软件技巧: 其它软件 Word Excel Powerpoint Ghost Vista QQ空间 QQ FlashGet 迅雷
网页制作: FrontPages Dreamweaver Javascript css photoshop fireworks Flash