2.9 将当前文档导出为SVG文档 [Illustrator CC教程]

1. SVG是指可缩放的矢量图形,可让您设计激动人心的、高分辨率的网页图形页面。首先依次点击[文件 > 存储为]命令,打开存储为窗口。


2.9 将当前文档导出为SVG文档 [Illustrator CC教程]_第1张图片
image

2. 点击[存储为]命令,弹出[存储为]窗口。


2.9 将当前文档导出为SVG文档 [Illustrator CC教程]_第2张图片
image

3. 接着点击[保存类型]下拉框,弹出系统预设保存类型列表。


2.9 将当前文档导出为SVG文档 [Illustrator CC教程]_第3张图片
image

4. 在弹出的保存类型列表中,选择所需的存储类型。


2.9 将当前文档导出为SVG文档 [Illustrator CC教程]_第4张图片
image

5. 接着在[文件名]输入框内,输入文件的名称。


2.9 将当前文档导出为SVG文档 [Illustrator CC教程]_第5张图片
image

6. 然后点击[保存]按钮,进入选项设置窗口。


2.9 将当前文档导出为SVG文档 [Illustrator CC教程]_第6张图片
image

7. 点击[代码]按钮,可以提前预览矢量图形代码。


2.9 将当前文档导出为SVG文档 [Illustrator CC教程]_第7张图片
image

8. 从打开的代码文档中可以看出,可缩放的矢量图形,其实是由代码来描绘的。点击关闭按钮,关闭预览窗口。


2.9 将当前文档导出为SVG文档 [Illustrator CC教程]_第8张图片
image

9. 最后点击[确定]按钮,完成可缩放的矢量图形文件的输出。


2.9 将当前文档导出为SVG文档 [Illustrator CC教程]_第9张图片
image

10. 使用键盘上的快捷键,离开系统界面,并切换至文档导出后所在的文件夹。


2.9 将当前文档导出为SVG文档 [Illustrator CC教程]_第10张图片
image

11. 在文档上双击,使用记事本打开该文档。当然您也可以使用其它的纯文本编辑器。


2.9 将当前文档导出为SVG文档 [Illustrator CC教程]_第11张图片
image

12. 在左上角的圆点处按下鼠标,然后滑动到右下角的圆点处,从而选择两点之间的所有代码。


2.9 将当前文档导出为SVG文档 [Illustrator CC教程]_第12张图片
image

13. 然后依次点击[编辑 > 复制]命令,拷贝选择的代码。


2.9 将当前文档导出为SVG文档 [Illustrator CC教程]_第13张图片
image
2.9 将当前文档导出为SVG文档 [Illustrator CC教程]_第14张图片
image

15. 点击键盘上的快捷键,离开记事本界面,并切换至网页设计软件。


2.9 将当前文档导出为SVG文档 [Illustrator CC教程]_第15张图片
image

16. 点击网页选项,创建一个空白的网页文档。


2.9 将当前文档导出为SVG文档 [Illustrator CC教程]_第16张图片
image

17. 依次点击[编辑 > 粘贴]命令,将刚刚复制的代码粘贴在相应的标签内。


2.9 将当前文档导出为SVG文档 [Illustrator CC教程]_第17张图片
image
2.9 将当前文档导出为SVG文档 [Illustrator CC教程]_第18张图片
image

19. 接着依次点击[文件 > 保存]命令,保存新建的网页文档。


2.9 将当前文档导出为SVG文档 [Illustrator CC教程]_第19张图片
image
2.9 将当前文档导出为SVG文档 [Illustrator CC教程]_第20张图片
image

21. 在[文件名]输入框内,输入网页的名称。


2.9 将当前文档导出为SVG文档 [Illustrator CC教程]_第21张图片
image

22. 然后点击保存按钮,保存网页文件。


2.9 将当前文档导出为SVG文档 [Illustrator CC教程]_第22张图片
image

23. 使用键盘上的快捷键,离开网页编辑界面,并切换网页所在文件夹。


2.9 将当前文档导出为SVG文档 [Illustrator CC教程]_第23张图片
image

24. 使用鼠标双击网页文件,使用浏览器打开该网页,查看网页显示的效果,并结束本节课程。


2.9 将当前文档导出为SVG文档 [Illustrator CC教程]_第24张图片
image
2.9 将当前文档导出为SVG文档 [Illustrator CC教程]_第25张图片
image

本文整理自:《Illustrator CC互动教程》,真正的[手把手]教学模式,用最快的速度上手Illustrator,苹果商店App Store免费下载:https://itunes.apple.com/cn/app/id1005557436,或扫描本页底部的二维码。课程配套素材下载地址:资料下载

你可能感兴趣的:(2.9 将当前文档导出为SVG文档 [Illustrator CC教程])