最近在做chrome的插件采集，一直一来自己都习惯于img标签或css的background-image来渲染网络图片,但是在测试的时候发现并不是这样，还有很多表现方式被自己疏漏
img:img标签是 HTML 中用于嵌入图像的最基本也是最常用的标签之一,标签是一个空元素，即不需要结束标签，通过src来指定资源路径- CSS
background-image:background-image用于设置元素的背景图像，他可以设置多个图片资源，并且会以层叠的方式来展现他们(第一个url将在最底层渲染)还可以通过background-xxx的相关属性来控制图像信息 <picture>标签:<picture>标签是 HTML5 中的一个元素，用于在网页中嵌入图像，他和img标签不同的地方主要在于<picture>是响应式设计而设计，通过内置的<source>元素和媒体查询条件，可以直接在 HTML 中实现复杂的响应式图像逻辑。而在<picture>中使用img，则会将img元素做为<picture>的一个兼容选项，当浏览器不支持<picture>时，则会渲染<img>- CSS
content: css中的伪元素实质上也是可以渲染图片的，通过content: url('')来引入,但是无法调整图片属性略显鸡肋，所以即使在使用伪元素时，更推荐background-image canvas:canvas是 HTML5 引入的一个新元素，它提供了一个通过 JavaScript 和 HTML的<canvas>元素来绘制图形的方式-
<embed>,<iframe>, 和<object>： 这三个标签 是 HTML 中用于嵌入外部内容或资源的三个不同标签，它们都可以用来展现图片资源，但是embed更适合用于嵌入简单的于多媒体文件，而iframe适用于需要嵌入完整 HTML 文档的场景，如嵌入第三方网站或应用程序。object则适用于嵌入多种类型的多媒体内容，包括需要插件支持的内容 - CSS
list-style-image：列表项前设置网络图片作为列表项的标志符。 <input type="image">是 HTML 中的一个表单输入类型，它创建了一个图像作为提交按钮。当用户点击这个图像时，图像坐标（x,y）的位置会被发送到服务器，同时表单中的其他数据也会被提交<link>网页图标
