svg base64
好多h5页面有出现data:image/png;base64,后面跟了一串类似乱码的字母
查了下原来这也是svg或者是图片
<img src=“data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAkCAYAAABIdFAMAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAHhJREFUeNo8zjsOxCAMBFB/KEAUFFR0Cbng3nQPw68ArZdAlOZppPFIBhH5EAB8b+Tlt9MYQ6i1BuqFaq1CKSVcxZ2Acs6406KUgpt5/LCKuVgz5BDCSb13ZO99ZOdcZGvt4mJjzMVKqcha68iIePB86GAiOv8CDADlIUQBs7MD3wAAAABJRU5ErkJggg==”/>
这种写法是把图像文件的内容直接写在了HTML 文件中,
好处是,
节省了一个HTTP 请求。
坏处呢,
就是浏览器不会缓存这种图像。
大家可以根据实际情况进行自由取舍。
转换工具:
http://tool.oschina.net/encrypt?type=4
直接使用装换出来的img即可
<img src="data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><line x1='0' y1='0' x2='200' y2='200' style='stroke:rgb(255,0,0);stroke-width:2' /> </svg>" />
这样就可以显示一个svg图片使用base64编码。
在线base64 加密 link:
http://base64encode.net/
在线base64 解密 link:
http://base64decode.net/
svg base64的更多相关文章
- image src base64 svg
1.显示img: 大家可能注意到了,网页上有些图片的src或css背景图片的url后面跟了一大串字符,比如:data:image/png;base64, iVBORw0KGgoAAAANSUhEUgA ...
- SVG & Blob & Base64
SVG & Blob https://developer.mozilla.org/en-US/docs/Web/API/Blob SVG & Base64 https://develo ...
- 8个实用的SVG工具,20 个有用的 SVG 工具,五款超实用的开源SVG工具
8个实用的SVG工具 [导读] 你还在为没有好用的SVG工具而发愁吗?开发人员的福音来啦!小编为大家收集罗列了8款实用的SVG工具,让我们一起来看看吧! SVG可缩放矢量图形(Scalable Vec ...
- SVG开发包, 20 个有用的 SVG 工具,提供更好的图像处理
20 个有用的 SVG 工具,提供更好的图像处理 SVG 现正在 Web 设计领域变得越发流行, 你可以使用 Illustrator 或者 Inkscape 来创建 SVG 图像. 但当进行 Web ...
- 使用 font-spider 对 webfont 网页字体进行压缩
原文链接:使用 font-spider 对 webfont 网页字体进行压缩 随着当前 Web 技术的日新月异,网页界面内容越来越丰富,让人眼花缭乱,其中就包括了网页中的各种自定义字体. 例如,个人博 ...
- svg转化成canvas以便生成base64位的图片
很久前写了关于把html转成图片的一个例子,最近有出了新的问题.利用html2canvas.js文件把html转成base64位的图片是没什么问题的,但也不是绝对的,比如这时候不能碰见svg这个鬼,h ...
- SVG:textPath深入理解
SVG的文本可以沿着一条自定义的Path来排布,比如曲线.圆形等等,使用方式如下所示(来源MDN): <svg viewBox="0 0 1000 300" xmlns=&q ...
- 用svg制作loading动画
首先说明:由于各浏览器对svg动画事件支持不统一,此loading动画在Firefox,Opera,Chrome中均没有问题,IE和Safari中有问题,可能是不支持SIML写动画的语法, 但是用Ca ...
- 绘制SVG内容到Canvas的HTML5应用
SVG与Canvas是HTML5上绘制图形应用的两种完全不同模式的技术,两种绘制图形方式各有优缺点,但两者并非水火不容,尤其是SVG内容可直接绘制在Canvas上的功能,使得两者可以完美的融合在一起, ...
随机推荐
- 设置sudo不输入密码 sudoers 编辑出错后的补救方法
一 设置sudo为不需要密码 有时候我们只需要执行一条root权限的命令也要su到root,是不是有些不方便?这时可以用sudo代替.默认新建的用户不在sudo组,需要编辑/etc/sudoers文件 ...
- spring事务传播属性与隔离级别
一.Propagation (事务的传播属性) Propagation : key属性确定代理应该给哪个方法增加事务行为.这样的属性最重要的部份是传播行为. 有以下选项可供使用: PROPAGATIO ...
- Localizing Astah – Chinese version(simplified) is now available!
Thanks to Abbey, now GUI in Astah Community can be shown in Chinese. As Abbey created Chinese one, a ...
- HDU5400 Arithmetic Sequence
解题思路:这题看懂题目是很关键的,这个区间是等差数列,且公差为d1或d2, 特别注意单个数字也为等差数列.每次求出等差数列序列长度,然后 求出对应这种长度对应有多少种组合方式,累加起来就是结果. ...
- phonegap 百度云推
1 创建新工程 -----获取api key 和secret key 2,推送设置 3,新建安卓项目,并把应用包名 和 推送中设置的包名设置一致 4,下载百度云客户端sdk 5,解压,并添加libs文 ...
- Http中Cookie与Set-Cookie头
[原文:http://hi.baidu.com/qinglvzhuye/item/6664a807bb8be3dd73e676d6] android 获取 cookies 有很多办法,但是记住了. h ...
- core文件分析
http://baidutech.blog.51cto.com/4114344/904419/ http://www.newsmth.net/pc/pccon.php?id=10001977& ...
- 第二个UI脚本--Python+selenium之unittest+HTMLtestRunner及python的继承
前面有一篇对于常见元素的识别和操作的python自动化脚本,这一篇就接着聊下python的类继承,已经它的第三款unittest框架,和报告收集包HTMLtestRunner的应用. 还是直接上代码吧 ...
- [转]LoadRunner参数化详解
http://www.cnblogs.com/fnng/archive/2012/06/22/2558900.html 距离上次使用loadrunner 已经有一年多的时间了.初做测试时在项目中用过, ...
- STM32 UART 重映射
在进行原理图设计的时候发现管脚的分配之间有冲突,需要对管脚进行重映射,在手册中了解到STM32 上有很多I/O口,也有很多的内置外设像:I2C,ADC,ISP,USART等 ,为了节省引出管脚,这些内 ...