data:image/jpg;base64格式的流文件展示为图片

data:image/jpg;    声明数据协议及类型名称
base64,            编码形式为base64
/9j/4AAQSkZ……    base64编码结果

<img src="data:image/jpg;base64,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" />

“data:image/jpg;base64,/9j/……” 就是一张图片的DataURL,就是利用base64编码把图片数据翻译成标准ASCII字符。
等同于:

<img src=”../images/code.jpg”>

最终的显示结果为:

  • 6
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值