ai怎么导出svg文件? ai导出svg并在html中使用的方法
发布时间：2015-11-12 14:37:13 作者：佚名 
我要评论
我要评论ai怎么导出svg文件? svg包含很多ai信息，但是如果要在html中使用的话就需要重新提取修改，该怎么提取呢？下面我们分享ai中提取svg文件的详细方法，需要的朋友可以参考下
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>
viewBox 和enable-background 的宽高不要修改，使用从ai保存的svg中的数据。
4、将从ai保存的svg中复制路径数据到上面新建的svg图标路径数据属性中，设置好颜色大小的信息，保存后就可以在html中正常使用了。
相关文章
ai怎么混合两种颜色? illustrator混合两个色块的颜色的方法
ai填充不同颜色的图形重叠以后，想要将两种颜色混合，该怎么混合颜色呢？下面我们就来看看详细的教程2024-07-18
ai网格线间距默认的不是很喜欢，想要自己调整一下，该怎么调整呢？今天我们就来看看参考线调整技巧2024-05-28
ai路径平均效果怎么用? illustrator使用平均路径的教程
Adobe Illustrator中有一个路径平均功能，如何使用呢？下面小编为大家演示路径平均功能的一种使用方法2024-05-21ai保存pdf格式出现多余内容怎么解决? 去掉pdf文件多余内容的技巧
ai保存pdf格式出现多余内容怎么解决？ai中的文档保存为pdf文件的时候，发现有多余内容，该怎么操作呢？下面我们就来看看去掉pdf文件多余内容的技巧2023-12-19- ai描边在哪里？ai中想要设置描边，该怎么操作呢？下面我们就来看看ai设置描边的多种方法2023-12-19
- ai原位复制怎么用？复制图形的时候，想要原位复制粘贴，该怎么操作呢？下面我们就来看看ai原位复制快捷键介绍2023-12-19
ai怎么让文字随着路径变形? illustrator区域文字不跟着变换方向问题的
ai怎么让文字随着路径变形？选中文字后，发现文字不跟随变换区域旋转该怎么办呢？下面我们就来看看illustrator区域文字不跟着变换问题的解决办法2023-11-30ai渐变色怎么调方向? illustrator将渐变颜色反向的技巧
ai渐变色怎么调方向？ai中给图形填渐变色，想要进行反向，该怎么操作呢？下面我们就来看看illustrator将渐变颜色反向的技巧2023-11-30
Ai彩色logo怎么做反白反黑效果? ai彩色logo转化为黑白稿的技巧
Ai彩色logo怎么做反白反黑效果？设计的彩色logo想要做黑白稿，就是反黑反白效果，下面我们就来看看ai彩色logo转化为黑白稿的技巧2023-11-12- ai怎么设计迷宫字体效果？我们需要使用分割网格结合形状生成器工具，制作迷宫字体，下面我们就来看看详细的设计过程2023-11-02
最新评论