AI切图PS插件(Layer Exporter)v2.1.0官方版

图层导出裁剪PS插件是一个支持Adobe Illustrator的裁剪插件。图层导出器可以帮助用户将AI图层导入到JPG、PNG、SVG等格式中。同时生成了一个. json文件，里面包含了大量的图形数据，可以作为开发的参考。

软件功能

将所有图层导出为SVG、PNG或JPG

并生成相应的HTML和CSS

施用方式

1.我们打开AI软件，然后打开AI或PS等其他软件设计的待裁剪网页的设计稿文件。然后，根据打开的设计草图文件的布局、背景颜色和图纸，进行裁剪图纸前的腹部分析和规划。比如，面对设计稿，如何才能裁剪出最好的效果，最快最准确的，哪些元素必须通过裁剪图纸才能获得，哪些元素不是必须的；为了方便切图，哪些字符必须暂时隐藏或者去掉，以便以后在这里替换在线动态字符和链接等等。下面是一个由AI设计的待裁剪网站的主页(注意，这是一个AI源文件)。

2.我们需要的刀具位于AI工具栏的中下部。和PS一样，有两个工具，一个是切片工具，一个是切片选择工具。左边有一个小按钮。如果按住它，这两个工具选项就会显示出来。

3.与上图相比，如果网页的背景色是纯色，我们可以不考虑切片，因为制作网页时可以通过定义一个类颜色值来填充CSS。如果有规则的渐变，可以根据渐变的不同方向裁剪出PX大小的图片，可以用于网页制作中的水平或垂直平铺填充；

4.下一步是将整个LOGO和右下角的广告图片切片。如箭头所示。

5.最后，是文本区域的切割。

6.为了切割准确，切割尺寸和面积合适，力求与设计草图完全一致，还可以进行以下微调操作。首先，在标尺出来后，按ctr R将参考线向右下拉。因为参考线在鼠标靠近时有吸附功能，在切图时不容易切错位置，这和PS切图完全一样。第二，可以通过改变数值来调整所选切片区域的长度和宽度。

7.切片区域确定后，下一步是保存每个区域。但是，需要提醒的是，在保存之前，必须隐藏或暂时删除不想作为图片呈现的文字。

8.切图之后，是最重要的一步。如下图所示，为WEB和设备选择文件下存储的格式，最好记住快捷键。

9.切片的存储格式有：jpg、gif和png。例如，如果格式设置为JPEG，则它是JPG，而gif是gif。

10.和PS cut的最终存储一样，关键是质量的设定。我们都知道，如果图片比较大，在网上打开的速度会比较慢。当我们设置较低质量的图片时，它的大小会更小。但是，如果质量太差，画面就会变得模糊。所以一般在网上使用的话，质量可以设置为60，保证画面更小不模糊。这个值是自己设定的，不管是大是小，看你的要求，试试就好。同样，这里也需要注意。问题是你只设置了一个切片的质量，其他切片都要重新设置，所以保存的时候最好检查一下。

11.一切设置完成后，点击商店将显示上述界面。格式选项是HTML和image，默认是image，这样我们就可以得到网页代码了。这里需要指出的是，在切片的时候，可以根据自己的需要，存储所有或者只存储指定的切片。

12.保存后，您可以获得一个图片文件夹和一个html网页文件。也许你在电脑上看到的文件图标和我的不一样。没关系，主要是我们选择的默认浏览器可能不一样。