Question

在我的html页面中，我在图像标记中使用了base64编码图像：

<img src="data:image/jpeg;base64,/9j/4AA" />

实际的base64代码要长得多，我在很多html文件中使用它。有没有办法将上面的内容放在css文件或其他文件中，以便我可以按名称引用它？

Answer 1

如果必须使用base64字符串而不是二进制字符串，则可以执行类似于css：

的操作

.picture {
   background:
     url(data:image/jpeg;base64,/9j/4AA...)
     no-repeat
     left center;
   width: 250px;
   height: 100px;
   display: inline-block;
}

然后将图片类应用于html中的div：

<div class="picture"></div>

请参阅：https://css-tricks.com/data-uris/

更新：这是一个将图片插入表格的片段：

.picture {
   background:
     url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAdUlEQVQ4ja1TQQ7AIAjjER7EZ+qb5DX7Ezu4RYaaTNCkF2KlRQqgD4cEjBkYKzBeD2qrhTTc/5JjEaQV8oKM9IPcFRk6K8QiPW+SX4Rk7C5V7HmfzMJObjjxgMcCnRii9xvdi2RbZXKESXeexjkWpYhabYzzDXHli0yOvPvwAAAAAElFTkSuQmCC)
     no-repeat
     center;
   display: inline-block;
   width: 16px;
   height: 16px;
}

<table>
  <tr>
    <td>
      <div class="picture"></div>
    </td>
    <td>Another Cell</td>
  </tr>
</table>

从另一个文件引用base64字符串

1 个答案: