Я могу встроить изображение .png в страницу HTML?
Как я могу встроить .png файл в пустой "file.html" так, чтобы при открытии того файла в каком-либо браузере, Вы видели то изображение? В этом сценарии файл изображения не связан с от HTML, а скорее данные изображения встраиваются в сам HTML.
3 ответа
Есть несколько кодировщиков 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 alt="My Image" src="data:image/png;base64,iVBORwA<MoreBase64SringHere>" />
используйте mod_rewrite для перенаправления вызова file.html на image.png без изменения url для пользователя
Пробовали ли вы просто переименовать файл image.png в file.html? Я думаю, что большинство браузеров принимают заголовок mime за расширение файла :)
Быстрый поиск в 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/