什么是SVG？

  • SVG 指可伸缩矢量图形 (Scalable Vector Graphics)
  • SVG 用于定义用于网络的基于矢量的图形
  • SVG 使用 XML 格式定义图形
  • SVG 图像在放大或改变尺寸的情况下其图形质量不会有损失
  • SVG 是万维网联盟的标准

SVG 的优势

与其他图像格式相比（比如 JPEG 和 GIF），使用 SVG 的优势在于：

  • SVG 图像可通过文本编辑器来创建和修改
  • SVG 图像可被搜索、索引、脚本化或压缩
  • SVG 是可伸缩的
  • SVG 图像可在任何的分辨率下被高质量地打印
  • SVG 可在图像质量不下降的情况下被放大

效果图：

<!DOCTYPE html>

<html>

<body>

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="190">

   <polygon points="100,10 40,180 190,60 10,60 160,180"

   style="fill:red;stroke:blue;stroke-width:3;fill-rule:evenodd;" />

</svg>

</body>

</html>

【HTML5】SVG内联的更多相关文章

  1. HTML5 Canvas、内联 SVG、Canvas vs. SVG

    canvas 元素用于在网页上绘制图形. 什么是 Canvas? HTML5 的 canvas 元素使用 JavaScript 在网页上绘制图像. 画布是一个矩形区域,您可以控制其每一像素. canv ...

  2. HTML5学习笔记3 内联SVG

    HTML5支持内联SVG 下面来介绍一下什么是SVG SVG可缩放矢量图形 可缩放矢量是基于可扩展标记语言(标准通用语言的子集),用于描述二维矢量图形的一种图形格式.它由万维网联盟制定,是一个开放标准 ...

  3. HTML5: HTML5 内联 SVG

    ylbtech-HTML5: HTML5 内联 SVG 1.返回顶部 1. HTML5 内联 SVG HTML5 支持内联 SVG. 什么是SVG? SVG 指可伸缩矢量图形 (Scalable Ve ...

  4. H5 内联 SVG

    HTML5 内联 SVG HTML5 画布 HTML5 画布 vs SVG HTML5 支持内联 SVG. 什么是SVG? SVG 指可伸缩矢量图形 (Scalable Vector Graphics ...

  5. 小强的HTML5移动开发之路（17）——HTML5内联SVG

    来自:http://blog.csdn.net/dawanganban/article/details/18189181 一.什么是SVG 可缩放矢量图形是基于可扩展标记语言(标准通用标记语言的子集) ...

  6. HTML5 学习03——内联 SVG

    什么是SVG? SVG 指可伸缩矢量图形 (Scalable Vector Graphics) SVG 用于定义用于网络的基于矢量的图形 SVG 使用 XML 格式定义图形 SVG 图像在放大或改变尺 ...

  7. 学习笔记——关于HTML（含HTML5）的块级元素和行级（内联）元素总结

    1.首先我们要知道什么是块级元素和行级(内联)元素? 块级(block)元素的特点: ①总是在新行上开始: ②高度,行高以及外边距和内边距都可控制: ③宽度缺省是它的容器的100%,除非设定一个宽度: ...

  8. HTML5有语义的内联元素详解

    HTML5有语义的内联元素详解 time标签 time 元素表示一个时间值,比如 5:35 P.M., EST, April 23, 2007.例如: Example Source Code:< ...

  9. 关于HTML（含HTML5）的块级元素和行级（内联）元素总结

    1.首先我们要知道什么是块级元素和行级(内联)元素? 块级(block)元素的特点: ①总是在新行上开始: ②高度,行高以及外边距和内边距都可控制: ③宽度缺省是它的容器的100%,除非设定一个宽度: ...

随机推荐

  1. ExtJS学习之路第二步：Ext.Component 和 Ext.dom.Element 的区别

    让我们来初步的探讨下Ext.Component和Ext.Element的区别. jQuery偏重于DOM元素的操作 1.每一个HTML页面都有一个层次分明的DOM树模型,浏览器中的所有内容都有相应的D ...

  2. linux下Nginx服务器安装教程

    序:Nginx服务器安装总结而已,不是教程. 安装的过程中出现了一些问题,原因我的云主机是纯净版,所以很多依赖包都没有.其中安装过程中就发现perl库缺少和openssl库缺少,因此我手动安装的这两款 ...

  3. 淘宝(阿里百川)手机客户端开发日记第六篇 Service详解(五)

    我们现在对上一节中的DEMO进行改进,在服务中开启线程来执行. package com.example.service; import android.app.Service; import andr ...

  4. 关于visio 2007导入独立图库

    很多作网络拓扑或服务器系统拓扑时,我们都会找到相关的Visio图库来画,但很多时候我们不知如何才能够直接导入,下面是我自己的导入方式,供大家参考下! 打开07Visio,自动加载设置: 工具--> ...

  5. Unity3d Static 静态批处理和动态批处理

    表示物体时静态的,多用于静止不动的物体,此外static有多种,有的用于烘焙,有的用于遮挡剔除 物理效果是rigidbody组件,和这个没关系,用transform.Translate 无法移动,因为 ...

  6. Android控件之圆形Button

    bg_circle.xml <?xml version="1.0" encoding="utf-8"?> <layer-list xmlns: ...

  7. Ubuntu上安装gtk2.0不能安装的问题，“下列的软件包有不能满足的依赖关系”

    zez@localhoss:~$ sudo apt-get install libgtk2.0-dev正在读取软件包列表... 完成正在分析软件包的依赖关系树       正在读取状态信息... 完成 ...

  8. 【Spring】Spring系列1之Spring概述

    概述

  9. RadioButtonList单选和RequiredFieldValidator验证是否选中

    <asp:RadioButtonList ID="Radio2" RepeatDirection="Horizontal" runat="ser ...

  10. 【转】js onclick用法：跳转到指定URL

    使用onclick跳转到其他页面/跳转到指定url   ☆如果是本页显示可以直接用location,方法如下: ①onclick="javascript:window.location.hr ...