是否有可能使用html渲染图像？ [英] Is it possible to render image with html?

问题描述

我控制了一个从文本文件获取html并在网页中呈现html的页面。
现在它必须在某处添加图像并引用该图像src。

我想知道我们是否可以将图像与其他html代码一起渲染，是否有可能？

解决方案

是的。您需要数据URI方案：

 < IMG SRC =数据：图像/ PNG; BASE64，
 iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs + 9AAAABGdBTUEAALGP 
 C / xhBQAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9YGARc5KB0XV + IA 
 AAAddEVYdENvbW1lbnQAQ3JlYXRlZCB3aXRoIFRoZSBHSU1Q72QlbgAAAF1J 
 REFUGNO9zL0NglAAxPEfdLTs4BZM4DIO4C7OwQg2JoQ9LE1exdlYvBBeZ7jq 
 ch9 // q1uH4TLzw4d6 + ErXMMcXuHWxId3KOETnnXXV6MJpcq2MLaI97CER3N0 
 vr4MkhoXe0rZigAAAABJRU5ErkJggg ==alt =Red dot/> 
  

同样可以在CSS中完成：

  ul.checklist> li.complete {margin-left：20px;背景：
 url（'data：image / png; base64，
 iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAA 
 ABlBMVEUAAAD /// + l2Z / dAAAAM0lEQVR4nGP4 / 5 / h / 1 + G / 5 
 8ZDrAz3D / McH8yw83NDDeNGe4Ug9C9zwz3gVLMDA / A6P9 / A 
 FGGFyjOXZtQAAAAAElFTkSuQmCC'）左上角无重复; } 
  

I have control in a page that gets html from text file and renders that html in webpage. Right now it has to add image somewhere and reference that image src.

I was wondering if we can render image along with other html code, is it possible?

解决方案

Yes, it is. You need a Data URI scheme:

<img src="data:image/png;base64,
iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABGdBTUEAALGP
C/xhBQAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9YGARc5KB0XV+IA
AAAddEVYdENvbW1lbnQAQ3JlYXRlZCB3aXRoIFRoZSBHSU1Q72QlbgAAAF1J
REFUGNO9zL0NglAAxPEfdLTs4BZM4DIO4C7OwQg2JoQ9LE1exdlYvBBeZ7jq
ch9//q1uH4TLzw4d6+ErXMMcXuHWxId3KOETnnXXV6MJpcq2MLaI97CER3N0
vr4MkhoXe0rZigAAAABJRU5ErkJggg==" alt="Red dot" />

The same can be done in CSS:

ul.checklist > li.complete { margin-left: 20px; background:
  url('data:image/png;base64,
iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAA
ABlBMVEUAAAD///+l2Z/dAAAAM0lEQVR4nGP4/5/h/1+G/5
8ZDrAz3D/McH8yw83NDDeNGe4Ug9C9zwz3gVLMDA/A6P9/A
FGGFyjOXZtQAAAAAElFTkSuQmCC') top left no-repeat; }

这篇关于是否有可能使用html渲染图像？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！