Как я могу вставить файл .png в пустой файл "file.html", чтобы при открытии этого файла в любом браузере вы видите это изображение? В этом случае файл изображения не связан с HTML, а данные изображения встроены в сам HTML.
Можно ли вставить изображение .png в html-страницу?
Ответ 1
Есть несколько кодировщиков base64 онлайн, которые помогут вам в этом, это, вероятно, лучшее, что я видел:
http://www.greywyvern.com/code/php/binary2base64
Как показано на этой странице, ваши основные параметры для этого: CSS:
div.image {
width:100px;
height:100px;
background-image:url(data:image/png;base64,iVBORwA<MoreBase64SringHere>);
}
Или сам тег <img>
, например:
<img alt="My Image" src="data:image/png;base64,iVBORwA<MoreBase64SringHere>" />
Ответ 2
Метод 64base также работает для больших изображений, я использую этот метод для встраивания всех изображений на свой сайт, и он работает каждый раз. Я делал файлы с размером размером 2 МБ, jpg и png.
Ответ 3
Я не знаю, как долго этот пост был здесь. Но сейчас я наткнулся на подобную проблему. Следовательно, размещение решения так, чтобы оно могло помочь другим.
#!/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
Ответ 4
Быстрый поиск в Google говорит, что вы можете вставлять его так:
<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">
Но вам нужна другая реализация в Internet Explorer.
http://www.websiteoptimization.com/speed/tweak/inline-images/
Ответ 5
используйте mod_rewrite, чтобы перенаправить вызов file.html на image.png без изменения URL-адреса для пользователя.
Вы пробовали просто переименовать файл image.png в файл .html? Я думаю, что большинство браузеров используют mime-заголовок для расширения файла:)