首页前端开发JavaScriptHTML5 内联 SVG

HTML5 内联 SVG

时间2024-01-29 06:42:03发布访客分类JavaScript浏览1074
导读:收集整理的这篇文章主要介绍了HTML5 内联 SVG,觉得挺不错的,现在分享给大家,也给大家做个参考。HTML5 支持内联 SVG。什么是SVG? (推荐学习:html教程 SVG 指可伸缩矢量图形 (Scalable Vector G...
收集整理的这篇文章主要介绍了HTML5 内联 SVG,觉得挺不错的,现在分享给大家,也给大家做个参考。HTML5 支持内联 SVG。

什么是SVG? (推荐学习:html教程)

SVG 指可伸缩矢量图形 (Scalable Vector Graphics)

SVG 用于定义用于网络的基于矢量的图形

SVG 使用 XML 格式定义图形

SVG 图像在放大或改变尺寸的情况下其图形质量不会有损失

SVG 是万维网联盟的标准

SVG 的优势

与其他图像格式相比(比如 JPEG 和 GIF),使用 SVG 的优势在于:

SVG 图像可通过文本编辑器来创建和修改

SVG 图像可被搜索、索引、脚本化或压缩

SVG 是可伸缩的

SVG 图像可在任何的分辨率下被高质量地打印

SVG 可在图像质量不下降的情况下被放大

浏览器支持

internet Explorer 9、Firefox、opera、Chrome 以及 Safari 支持内联 SVG。

把 SVG 直接嵌入 HTML 页面

在 HTML5 中,您能够将 SVG 元素直接嵌入 HTML 页面中:

实例

!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:lime;
    stroke:purple;
    stroke-width:5;
    fill-rule:evenodd;
    " />
    /svg>
    /body>
    /html>
    

以上就是HTML5 内联 SVG的详细内容,更多请关注其它相关文章!

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!

上一篇: HTML 5 画布 vs SVG下一篇:html表格标签猜你在找的JavaScript相关文章 html font标签如何设置字体大小?html font标签属性用法介绍2022-05-16vue3+TypeScript+vue-router的使用方法2022-04-16vue3获取当前路由地址2022-04-16如何利用React实现图片识别App2022-04-16JavaScript展开运算符和剩余运算符的区别详解2022-04-16微信小程序中使用vant框架的具体步骤2022-04-16Vue elementUI表单嵌套表格并对每行进行校验详解2022-04-16如何利用Typescript封装本地存储2022-04-16微信小程序中wxs文件的一些妙用分享2022-04-16JavaScript的Set数据结构详解2022-04-16 其他相关热搜词更多phpjavapython程序员loadpost-format-gallery

若转载请注明出处: HTML5 内联 SVG
本文地址: https://pptw.com/jishu/590734.html
在HTML页面中引入外部HTML文件的解决方案 HTML的
标签

游客 回复需填写必要信息