SVG格式图片转成HTML中SVG的Path路径
AI图标制作完成之后,保存的svg文件包含许多AI的信息,如果要在HTML中使用,我们需要在svg文件中提取/修改信息,重新保存。
1、在AI中已经完成图标,要保存SVG文件,点击“文件(File)”-“另存为(Save As)”,在弹出的对话框中保存类型选择SVG(*.svg)。
2、svg文件保存后,用文本编辑器打开,找到<path>这一个节点,d属性里面就是这个图片的路径数据【注:在保存svg图标的时候需要使用路径查找器工具将图标制作为复合路径,不然该svg文件中会有多个<path>节点】。
3、可以新建一个.svg文件,用文本编辑器打开,输入以下内容
- <?xml version="1.0" encoding="utf-8"?>
- <svg
- version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="左偏移量(px)" y="上偏移量(px)"
- width="宽度" height="高度" viewBox="0 0 宽度 高度" enable-background="new 0 0 宽度 高度"
- xml:space="preserve">
- <g>
- <path stroke="描边颜色" fill="填充颜色" d="图标路径数据"/>
- </g>
- </svg>
SVG格式图片转成HTML中SVG的Path路径的更多相关文章
- png格式图片转为svg格式图片
png格式图片转为svg格式图片 (2012-08-30 16:24:00) 转载▼ 标签: 杂谈 分类: linux 在ubuntu下将png格式的图片转换成svg格式步骤如下:1.安装 inksc ...
- 关于svg格式图片颜色更改
利用 style="fill:#8a8acb" 放在path标签下面. 技巧:比如一个svg是一个圆圈内包含一个问号,问号内填充白色,圆圈内,问号外,填充其他颜色,如蓝色.可 设置 ...
- FFMpeg笔记(一) 使用FFmpeg将任意格式图片转换成任意格式图片
void SrcToDest(char* pSrc, char* pDest,unsigned int nSrcWidth, unsigned int nSrcHeight, AVPixelForma ...
- 本地显示svg正常显示,在工程项目中无法正常显示
提前说明:此文仅记录个人项目问题,不具有众参考意义. 原因: 工程中对引用的资源进行解析设置,即resource设置. 解决方法: 找到静态资源加载路径,添加 if(urlpostfix.equals ...
- echarts 支持svg格式
今天研究了下echarts的svg格式.发现用ai生成svg格式的图片,echarts上面显示不了. 经过了多次的百度和谷歌终于找到了用Method Draw画出来的svg格式,echarts就能加载 ...
- BitmapUtil【缩放bitmap以及将bitmap保存成图片到SD卡中】
版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 用于缩放bitmap以及将bitmap保存成图片到SD卡中 效果图 代码分析 bitmapZoomByHeight(Bitmap s ...
- QT_SVG格式图片浏览器_源代码下载_详细注释
源代码链接: http://pan.baidu.com/s/1pKA5Vcv 密码: ib2x 注:SVG格式图片特点: 1. 文件小 2. 图像中文字独立于图像, 可以编辑,可搜索. 3.没有字体限 ...
- Java中将JSON格式的数据转换成对应的Bean、Map、List数据
简单说明: 为了方便数据在客户端及服务器端的传输,有时候我们会用一些比较方便组织的数据类型,比如json.xml等传给客户端,客户端也可以重新组织数据传回服务器端.JSON和XML提供了一套比较方便的 ...
- Python之os.path路径模块中的操作方法总结
#os.path模块主要集成了针对路径文件夹的操作功能,这里我们就来看一下Python中的os.path路径模块中的操作方法总结,需要的朋友可以参考下 解析路径路径解析依赖与os中定义的一些变量: o ...
随机推荐
- android note【转】
本文转载自:http://blog.csdn.net/u012719256/article/details/52094982 1.重要的property属性 #define ANDROID_RB_PR ...
- bzoj1143: [CTSC2008]祭祀river && bzoj27182718: [Violet 4]毕业旅行
其实我至今不懂为啥强联通缩点判入度会错... 然后这个求的和之前那道组合数学一样,就是最长反链=最小链覆盖=最大独立集. #include<cstdio> #include<iost ...
- 在C#中实现listbox的项上下移动(winform) 标准
在C#中实现listbox的项上下移动(winform) 收藏人:梅毛子360 2013-10-02 | 阅:1 转:2 | 分享 | 来源 usi ...
- atoi函数——将字符串转换为整数
atoi在一个叫<cstdlib>的库里,可以把字符串直接转换为整数,贼强势. 还有一个atof,就是换成浮点数,实质上是一样的. 例子: #include<cstdlib> ...
- Word中公式和文字混排对齐的问题
全选-字体-字符间距-位置-标准-确定 段落-中文版式-文本对齐方式-居中-确定
- 适用于zTree 、EasyUI tree、EasyUI treegrid
#region System.Text.StringBuilder b_appline = new System.Text.StringBuilder(); Syste ...
- IIS Express配置多站点同时运行
环境:Win10 Pro.Visual Studio 2015 Community.IIS Express 10 VS2015集成IIS Express,所以无需单独下载, 默认安装位置:C:\Pro ...
- Unity学习-软件的基本操作(二)
基本操作 1:Scene中 以小手显示,平移画布,与鼠标中键一样 2:平移 游戏对象,组件的 Position属性 也可设置 3:旋转 游戏对象,组件的 Rotation属性 也可设置 4:缩放 游戏 ...
- CSS3悬浮动画效果
利用CSS3的伪类元素hover以及transform,transition等动画属性,可以做出一些炫酷的动画效果.下面将一些项目中使用到的示例发布出来,供大家一起学习研究.演示地址:runjs. 浏 ...
- Android开发高手课笔记 - 01 崩溃优化(上):关于“崩溃”那点事
Android 的两种崩溃 Java 崩溃就是在 Java 代码中,出现了未捕获的异常,导致程序异常退出 Native 崩溃一般都是因为在 Native 代码中访问非法地址,也可能是地址对齐出了问题, ...