base64数据

DataURI是一种将小数据直接嵌入到网页的技术,避免了额外的HTTP请求,支持文本、HTML、CSS、JavaScript及多种图像格式。本文介绍了DataURI的定义、支持的类型及其在网页中的应用。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

 

Data URI scheme是在RFC2397中定义的,目的是将一些小的数据,直接嵌入到网页中,从而不用再从外部文件载入。

data表示取得数据的协定名称,image/png 是数据类型名称,base64 是数据的编码方法,逗号后面就是这个image/png文件base64编码后的数据。
目前,Data URI scheme支持的类型有:

类型描述
data:,文本数据
data:text/plain,文本数据
data:text/html,HTML代码
data:text/html;base64,base64编码的HTML代码
data:text/css,CSS代码
data:text/css;base64,base64编码的CSS代码
data:text/javascript,Javascript代码
data:text/javascript;base64,base64编码的Javascript代码
data:image/gif;base64,base64编码的gif图片数据
data:image/png;base64,base64编码的png图片数据
data:image/jpeg;base64,base64编码的jpeg图片数据
data:image/x-icon;base64,base64编码的icon图片数据

网页中一张图片可以这样显示:

<img src=“http://img10.360buyimg.com/imgzone/jfs/t1/40966/18/6468/250346/5d0062fdE2ad7d274/8f71146ab69ffa56.jpg”/>
也可以这样显示:
<img src=“data:image/png;base64,xxx”/> xxx为字节流的base64编码
  把图像文件的内容直接写在了HTML 文件中,好处,节省了一个HTTP 请求。坏处,浏览器不会缓存这种图像。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值