SVG语法教程指南中文版.pdfVIP

SVG 语法教程指南中文版 感谢：翻译蔡发明，YAO-2100整理。 1 SVG简介 SVG是由W3C制定的基于可扩展标记语言(XML)来描述二维矢量图型的一个 开放标准。 1.1 学习之前应具备的知识基础 你应该确保你有以下知识基础以便在后面更好的学习和理解SVG，并达到事 半功倍的效果： * HTML * Basic XML 如果你想先学习一下这些知识。请访问W3Schools Online Web Tutorials(英 文站点)，中文内容可以访问SVG中国的基础内容栏目。 1.2 什么是svg? * SVG 指的是Scalable Vector Graphics，“可升级矢量图形”的意思； * SVG 是用来定义面向web的矢量图形； * SVG 基于XML语言定义图形； * 当你放大或重新设置图形大小时，SVG 图形质量不会有所损失； * SVG 里的每一个元素和属性都可以自定义； * SVG 是一个W3C推荐标准； * SVG 可以和W3C的其他推荐标准结合使用。 1.3 SVG的历史和优点 Web浏览器在表现矢量图形方面的薄弱，引起各大软件厂商和组织纷纷推出 自己的矢量图形规范，为统一标准结束这种混乱局势，W3C组织于1998年8月 专门成立了SVG工作组致力于图形标准的制定工作，同时Microsoft、Sun、HP、 IBM、Apple、Adobe、Corel及Kodak等一些著名公司也参与到SVG标准的制定。 W3C于1999年2月11 日发布了SVG第一个讨论草案； W3C于2001年9月4日发布 SVG 1.0; W3C于2003年1月4日发布 SVG 1.1; W3C于2003年1月14日推出SVG 移动子版本：SVG Tiny和SVG Basic; W3C于2005年4月日发布的SVG 1.2草案; W3C于2006年8月10日 SVG Tiny 1.2 为 W3C 候选推荐标准。 与其他图形格式（JPEG、GIF）相比使用SVG的优点如下： * SVG 文件可以被很多的工具（比如记事本）阅读和编辑； * SVG 文件比JPEG和GIF更小压缩比更大； * SVG 图像是可压缩的； * SVG 图像可以以任何分辨率高清晰打印； * SVG 图像是可缩放的，图像的任何部分都可以无损失缩放； * SVG 里的文字是可供选择和搜索（制作地图的良好功能）； * SVG 可以和诸如java等技术共同工作； * SVG 是一个开放标准； * SVG 文件是纯xml的。 SVG的主要竞争对手是Flash。 SVG与Flash两者有很多的相似特征，但和Flash相比SVG最大优点是他与 其他标准（比如XSL和DOM）相兼容。而Flash则是未开源的私有专利技术，只 属Adobe公司所有，不具有开放性。 1.4 查看SVG文件 SVG的最大缺点是没有完全支持SVG的浏览器，准确的说是主流浏览器不支 持SVG文件的显示。不过当前越来越多的厂商已经投入到开发SVG项目中，并且 很多著名企业已经发布支持SVG的程序软件，SVG阵营正在迅猛扩大。 Opera浏览器支持SVG显示。 Mozilla Firefox浏览器自版本1.5发行后，开始支持SVG显示。 加载了Adobe SVG Viewer的Internet Explorer也能支持多数SVG特性， 但是由于没有浏览器的原生支持，在交互方面许多特性不支持。不过Microsoft 正计划Internet Explorer 8.0内置支持SVG显示。 我们等待SVG在更多流行的浏览器软件上支持，到那时SVG的时代就将带来。 二、SVG实例 SVG是用XML来编写的。 2.1 SVG的一个实子 下面的例子是一个SVG的简单实例，SVG文件必须保存扩展名为“.svg”格 式。 ?xml version=1.0 standalone=no? !DOCTYPE svg PUBLIC -//W3C//DTD SVG 1.1//EN /Graphics/SVG/1.1/DT