php 我可以将 .png 图像嵌入到 html 页面中吗？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2807251/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Can I embed a .png image into an html page?
提问by Rella
How can I embed a .png file into a blank "file.html" so that when you open that file in any browser you see that image? In this scenario the image file is not linked to from the HTML but rather the image data is embedded in the HTML itself.
如何将 .png 文件嵌入到空白的“file.html”中，以便在任何浏览器中打开该文件时都能看到该图像？在这种情况下，图像文件不是从 HTML 链接到的，而是图像数据嵌入在 HTML 本身中。
回答by Nick Craver
There are a few base64 encoders online to help you with this, this is probably the best I've seen:
网上有一些 base64 编码器可以帮助你解决这个问题，这可能是我见过的最好的：
http://www.greywyvern.com/code/php/binary2base64
http://www.greywyvern.com/code/php/binary2base64
As that page shows your main options for this are CSS:
由于该页面显示您的主要选项是 CSS：
div.image {
width:100px;
height:100px;
background-image:url(data:image/png;base64,iVBORwA<MoreBase64SringHere>);
}
Or the <img>tag itself, like this:
或者<img>标签本身，像这样：
<img alt="My Image" src="data:image/png;base64,iVBORwA<MoreBase64SringHere>" />
回答by Diamax
The 64base method works for large images as well, I use that method to embed all the images into my website, and it works every time. I've done with files up to 2Mb size, jpg and png.
64base 方法也适用于大图像，我使用该方法将所有图像嵌入到我的网站中，并且每次都有效。我已经完成了最大2Mb 大小的文件，jpg 和 png。
回答by Sand33p Prakash
I don't know for how long this post has been here. But I stumbled upon similar problem now. Hence posting the solution so that it might help others.
我不知道这个帖子在这里多久了。但我现在偶然发现了类似的问题。因此发布解决方案，以便它可以帮助其他人。
#!/usr/bin/env perl
use strict;
use warnings;
use utf8;
use GD::Graph::pie;
use MIME::Base64;
my @data = (['A','O','S','I'],[3,16,12,47]);
my $mygraph = GD::Graph::pie->new(200, 200);
my $myimage = $mygraph->plot(\@data)->png;
print <<end_html;
<html><head><title>Current Stats</title></head>
<body>
<p align="center">
<img src="data:image/png;base64,
end_html
print encode_base64($myimage);
print <<end_html;
" style="width: 888px; height: 598px; border-width: 2px; border-style: solid;" /></p>
</body>
</html>
end_html
回答by juandopazo
Quick google search says you can embed it like this:
快速谷歌搜索说你可以像这样嵌入它：
<img src="data:image/gif;base64,R0lGODlhEAAOALMAAOazToeHh0tLS/7LZv/0jvb29t/f3//Ub/
/ge8WSLf/rhf/3kdbW1mxsbP//mf///yH5BAAAAAAALAAAAAAQAA4AAARe8L1Ekyky67QZ1hLnjM5UUde0ECwLJoExKcpp
V0aCcGCmTIHEIUEqjgaORCMxIC6e0CcguWw6aFjsVMkkIr7g77ZKPJjPZqIyd7sJAgVGoEGv2xsBxqNgYPj/gAwXEQA7"
width="16" height="14" alt="embedded folder icon">
But you need a different implementation in Internet Explorer.
但是您需要在 Internet Explorer 中进行不同的实现。
http://www.websiteoptimization.com/speed/tweak/inline-images/
http://www.websiteoptimization.com/speed/tweak/inline-images/
回答by Thomas Winsnes
use mod_rewrite to redirect the call to file.html to image.png without the url changing for the user
使用 mod_rewrite 将对 file.html 的调用重定向到 image.png 而不为用户更改 url
Have you tried just renaming the image.png file to file.html? I think most browser take mime header over file extension :)
您是否尝试过将 image.png 文件重命名为 file.html？我认为大多数浏览器在文件扩展名上使用 mime 标头:)
