华域联盟
  • 资讯
    • 安全资讯
    • 漏洞资讯
    • PDF电子书
  • 安防
    • 安防设备
    • 网络安防
    • 黑客工具
    • 黑客技术
  • 编程
    • .Net
    • 易语言
    • Andriod
    • C/C++
    • HarmonyOS
    • IOS
    • JAVA
    • Visual Basic
  • 数据库
    • Access
    • Mariadb
    • MySQL
    • Oracle
    • Redis
    • SQL Server
  • 网页制作
    • PHP
    • ASP
    • XML/XSLT
    • CSS
    • Dreamweaver
    • HTML
    • HTML5
    • JavaScript
    • Frontpage
  • 脚本
    • 游戏相关
    • 远程脚本
    • 游戏脚本
    • autoit
    • ColdFusion
    • DOS/BAT
    • Erlang
    • Golang
    • hta
    • htc
    • linux shell
    • Lua
    • perl
    • PowerShell
    • Python
    • ruby专题
    • seraphzone
    • VBA
    • vbs
  • 操作系统
    • Linux
    • Mac OS
    • Windows
    • Unix
    • Windows PE
    • 鸿蒙系统
  • 网络
    • 交换机
    • 路由器
    • 防火墙
  • 平面设计
    • 摄影
    • photoshop
      • ps抠图教程
      • PS调色教程
      • 入门实例
      • 合成特效
      • 照片处理
      • 其它综合
    • CorelDraw
    • Fireworks
    • Freehand
    • Illustrator
    • Indesign
    • Painter
  • 站点公告
    • 未分类
    • 分享
    • 纸篮子
登录

HTML5新特性之用SVG绘制微信logo

2021-12-19 HTML5 0 0 67 0
  • 详情介绍
  • 常见问题
  • 评论建议

HTML5新特新
HTML5 中的一些有趣的新特性:
1、用于绘画的 canvas 元素
2、用于媒介回放的 video 和 audio 元素
3、对本地离线存储的更好的支持
4、新的特殊内容元素,比如 article、footer、header、nav、section
5、新的表单控件,比如 calendar、date、time、email、url、search
svg绘制图片效果图:

代码如下:

复制代码 代码如下:

<style>

* {

padding: ;

margin: ;

}

body {

background-color: #ddd;

}

.container {

width: px;

height: px;

position: relative;

top: px;

left: %;

transform: translated(-%,,);

background-color:#c;

border-radius: px;

box-shadow: px #cbfbf;

}

.container object{

position:relative;

top:px;

left:px;

}

</style>

<body>

<div class=”container”>

<object data=”logo.svg” width=”” height=”” type=”image/svg+xml” />

</div>

</body>

这个是xml格式的代码,跟html文档分离的。

复制代码 代码如下:

<?xml version=”.” standalone=”no”?>

<!DOCTYPE svg PUBLIC “-//WC//DTD SVG .//EN”

“http://www.w.org/Graphics/SVG/./DTD/svg.dtd”>

<svg width=”%” height=”%” version=”.” xmlns=”http://www.w.org//svg”>

<ellipse cx=”” cy=”” rx=”” ry=”” style=”fill:rgb(,,);stroke:rgb(,,);stroke-width:”/>

<circle cx=”” cy=”” r=”” style=”fill:#c;stroke:#c;stroke-width:”/>

<circle cx=”” cy=”” r=”” style=”fill:#c;stroke:#c;stroke-width:”/>

<polygon points=”, , ,” style=”fill:#fff;stroke:#fff;stroke-width:”/>

<ellipse cx=”” cy=”” rx=”” ry=”” style=”fill:#c;stroke:#c;stroke-width:”/>

<ellipse cx=”” cy=”” rx=”” ry=”” style=”fill:rgb(,,);stroke:rgb(,,);stroke-width:”/>

<circle cx=”” cy=”” r=”” style=”fill:#c;stroke:#c;stroke-width:”/>

<circle cx=”” cy=”” r=”” style=”fill:#c;stroke:#c;stroke-width:”/>

<polygon points=”, , ,” style=”fill:#fff;stroke:#fff;stroke-width:”/>

</svg>

以上所述是小编给大家分享的HTML5新特性之用SVG绘制的微信logo ,希望对大家有所帮助。


声明:本站(华域联盟www.cnhackhy.com)所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。
HTML5 svg 微信logo 新特征
sterben
分享 收藏 点赞(0)
  1. 提示下载完但解压或打开不了?
    最常见的情况是下载不完整: 可对比下载完压缩包的与网盘上的容量,若小于网盘提示的容量则是这个原因。这是浏览器下载的bug,建议用百度网盘软件或迅雷下载。 若排除这种情况,可在对应资源底部留言,或联络我们。
  2. 找不到素材资源介绍文章里的示例图片?
    对于会员专享、整站源码、程序插件、网站模板、网页模版等类型的素材,文章内用于介绍的图片通常并不包含在对应可供下载素材包内。这些相关商业图片需另外购买,且本站不负责(也没有办法)找到出处。 同样地一些字体文件也是这种情况,但部分素材会在素材包内有一份字体下载链接清单。
  3. 付款后无法显示下载地址或者无法查看内容?
    如果您已经成功付款但是网站没有弹出成功提示,请联系站长提供付款信息为您处理

评论(0)

提示:请文明发言 取消回复

您的邮箱地址不会被公开。 必填项已用 * 标注

上一篇
HTML5 History API 实现无刷新跳转
下一篇
Photoshop如何使用通道保留皮肤质感给人像照片磨皮

相关文章

HTML5

萌新HTML5 入门指南(二)

本文由葡萄城技术团队原创并首发 上一篇我们已经为大家介绍了HTML5新增的内容和...
4 年前 0 0 63
HTML5

Canvas制作的下雨动画的示例

简介 在codepen上看到一个canvas做的下雨效果动画,感觉蛮有意思的。就...
4 年前 0 0 62
HTML5

html5 拖拽及用 js 实现拖拽功能的示例代码

1. HTML5 拖拽 1.1 相关知识 拖拽元素:可以为元素添加 dragga...
4 年前 0 0 60
HTML5

HTML5 Canvas实现平移/放缩/旋转deom示例(附截图)

HTML5 canvas中提供了实现图形平移,旋转,放缩的API。 平移(tra...
4 年前 0 0 56

近期文章

  • 三六零入选国家数据发展研究院数据安全协同工作组首批成员单位
  • 《新闻联播》报道!全国政协召开专题协商会,周鸿祎建言培养“硅基领导力”新型人才
  • thinking模式深度推理:M3怎么帮你修最难的Bug
  • MonkeyCode实现分布式锁:从Redis到ZooKeeper的完整实战
  • 终于等到了! Win11 Arm版新增RSAT远程管理工具支持

近期评论

您尚未收到任何评论。
华域联盟

维护网络安全,宣扬安全知识

快速导航

  • 个人中心
  • 标签云
  • 友情链接

关于本站

  • 客服咨询
  • 推广计划

流量统计25-7-18

Flag Counter
Copyright © 2015 华域联盟 - All rights reserved
蒙ICP备2024007863号-1https://beian.mps.gov.cn/蒙公网安备15062202000105号
TrustAsia 安全签章
  • 首页
  • 用户中心
  • QQ客服
  • 首页
  • 分类
  • 我的
华域联盟