HTML5 - SVG

HTML5 SVG | HTML5 SVG教程| HTML5 SVG示例 - 通过简单简单的步骤学习HTML 5，其中包含2D画布，音频，视频，新语义元素，地理位置，持久本地存储，Web存储，Web SQL，Forms 2.0，微数据和拖放，IndexedDB，Web消息传递，CORS，Web RTC，画布绘制矩形，Web存储，服务器发送事件，Web画布，Web工作者，幻灯片。

SVG代表 S calable V ector G raphics，它是一种用于描述XML中的2D图形和图形应用程序的语言.然后由SVG查看器呈现XML.

SVG主要用于矢量类型图，如饼图，X，Y坐标系中的二维图等.

SVG成为W3C推荐标准14.

查看SVG文件

大多数Web浏览器都可以显示SVG，就像它们可以显示一样PNG，GIF和JPG. Internet Explorer用户可能必须安装 Adobe SVG Viewer 才能在以下位置查看SVG使用< svg> ... 标签，其中包含以下简单语法 :

...

Firefox 3.7还引入了一个配置选项("about:config")，您可以使用以下步骤启用HTML5 :

在您的Firefox地址栏中输入 about:config .
点击"我会小心，我保证！"出现的警告消息上的按钮(并确保您遵守它！).
在过滤器中键入 html5.enable 页面顶部的栏.
目前它已被禁用，因此请点击它以将值切换为true.

现在应启用Firefox HTML5解析器，您应该可以尝试以下示例.

HTML5 - SVG Circle

以下是SVG示例的HTML5版本，它将使用< circle> tag绘制圆圈 :

                  SVG                     HTML5 SVG Circle

HTML5 − SVG Rectangle

以下是SVG示例的HTML5版本，该示例将使用标签绘制矩形

                  SVG                     HTML5 SVG Rectangle

HTML5 − SVG Line

以下是SVG示例的HTML5版本，该示例将使用标签绘制一条线

                     SVG                     HTML5 SVG Line

您可以使用样式属性，该属性允许您设置其他样式信息，例如笔触和填充颜色，笔触的宽度等。

HTML5 − SVG Ellipse

以下是SVG示例的HTML5版本，该示例将使用标签绘制一个椭圆

                     SVG                  HTML5 SVG Ellipse

HTML5 − SVG Polygon

以下是SVG示例的HTML5版本，该示例将使用标签绘制多边形

                  SVG                  HTML5 SVG Polygon

HTML5 − SVG Polyline

以下是SVG示例的HTML5版本，该示例将使用标签绘制一条折线

                     SVG                  HTML5 SVG Polyline

HTML5 − SVG Gradients

以下是SVG示例的HTML5版本，该示例将使用标签绘制椭圆，并使用标签定义SVG径向渐变。

同样，您可以使用标签创建SVG线性渐变。

                     SVG                  HTML5 SVG Gradient Ellipse

HTML5 − SVG Star

以下是SVG示例的HTML5版本，该示例将使用标签绘制星形。

                  SVG                     HTML5 SVG Star