图片内联就是把图片数据放入到网页中,不再通过http去请求服务器获得图片(邮件中可以使用).
也有用做减少http请求: http://stevesouders.com/examples/inline-images.php
内联方式的格式: data:[<mediatype>][;base64],<data>
下面是Python 读取文件然后进行base64编码.
#-*- coding: utf-8 -*-
import base64
def encode(i="", o=""):
try:
input = open(i, "rb")
output = open(o, "wb")
base64.encode(input, output)
print "done..."
except Exception, e:
print e
def decode(i="", o=""):
try:
input = open(i, "rb")
output = open(o, "wb")
base64.decode(input, output)
print "done..."
except Exception, e:
print e
if __name__ == "__main__":
encode("1.gif", "1_base64.txt")
用上面代码把图片进行base64编码,把编码后的字符按标准放入<img src="data:image/gif;base64, /9j/4AAQSkZJRgABAQEASABIAAD/2w..." /> , 浏览可看到到图片.
在用Python 打开文件时得加入'b' 标志,开始没有加入测试,编码的文件不完整.
Firefox 和 Chrome 不仅支持图片, 而且还支持声音文字,更多参考: https://developer.mozilla.org/en/The_data_URL_scheme
.
但是在ie8中测试不支持, 还有就是ie中对大小有限制.
参考文档:
http://tools.ietf.org/html/rfc2397
分享到:
相关推荐
Data URLs是一种内联资源的方式,它将资源的数据直接嵌入到URL中。这种格式通常以"data:"开头,后面跟着媒体类型,然后是";base64,",最后是BASE64编码的数据。在HTML中,我们可以直接用Data URL作为`<img>`标签的`...
4. **Data URLs**:Data URL是一种内联资源表示方式,其中包含数据的MIME类型和编码数据。Base64编码就是一种常见的Data URL形式。 接下来,我们按照以下步骤实现图片压缩上传: 1. **选择图片**:通过HTML的`...
1.0.3.1:-解决了选项保存问题(Content-Security-Policy不允许进行内联事件。将选项代码移至其自己的文件(options.js))-已更新为使用版本2清单。 -使用Barry Leiba的补丁程序进行更新,以处理https和“ rfc-...
使用DATA URLS的项目思想是轻松获取包含数据集的URL参数。 读取数据集以显示侧面导航栏后,用户可以在其中以下拉格式查看列名称,并可以动态更改它们的可视化。 ***请注意,该项目可以读取JSON格式或CSV格式** ***...
语言:English (United ... 1.0.3.1: - 修正选项保存问题(内容 - 安全策略不允许内联事件。将选项代码移动到自己的文件(选项。)) - 更新以使用版本2表单。 - 从Barry Leiba更新补丁来处理HTTPS和“RFC-EDitor.org”
嵌入式资源(如图像或字体)在适当的情况下使用DataUrls 一个简单的标志按需加载一个React组件(和依赖项)。 发展 开发服务器 可选的热模块替换开发服务器(启用了用于样式表和React组件的LiveReload) 使用...
特征使用webpack进行编译React和jsx React路由器样式表可以是CSS,LESS,SASS,Stylus或混合样式嵌入式资源(如图像或字体)在适当的情况下使用DataUrls 一个简单的标志按需加载一个React组件(和依赖项)。...
特征使用webpack进行编译React和jsx React路由器样式表可以是CSS,LESS,SASS,Stylus或混合样式嵌入式资源(如图像或字体)在适当的情况下使用DataUrls 一个简单的标志按需加载一个React组件(和依赖项)。...
特征使用webpack进行编译React和jsx React路由器样式表可以是CSS,LESS,SASS,Stylus或混合样式嵌入式资源(例如图像或字体)在适当的情况下使用DataUrls 一个简单的标志按需加载一个React组件(和依赖项)。...
SeoBinaryLink技术可能是通过利用现代浏览器支持的特性,如Data URI Scheme或Blob URLs,来实现二进制数据的内联表示。Data URI Scheme允许将数据直接嵌入到URL中,减少HTTP请求的数量,从而提高页面加载速度。Blob ...
- 使用CSS sprites和data URLs减少HTTP请求。 7. 浏览器兼容性 - 了解不同浏览器对CSS特性的支持情况,合理使用前缀(-webkit-, -moz-, -ms-, -o-)以确保跨浏览器兼容性。 - 使用Autoprefixer工具自动添加浏览器...