我正在创建一个轻量级的单文件数据库管理工具,我想将一些小图标与它捆绑在一起。在 HTML/PHP 文件中嵌入图像的最佳方法是什么?
我知道一种使用 PHP 的方法,我可以使用 GET 参数调用同一个文件,该参数将输出具有正确标头的硬编码二进制数据,但这似乎有点复杂。
我可以使用一些东西直接在 CSS 中传递图像吗background-image
宣言?这将使我能够利用 CSS sprite 技术。
浏览器支持在这里不是问题,因此也欢迎更多奇特的方法。
EDIT
有人有如何使用 PHP 正确生成数据 URL 的链接/示例吗?我想echo 'data:image/png;base64,'.base64_encode(file_get_contents('image.png'))
就足够了,但我可能是错的。
将图像直接嵌入 HTML 页面的解决方案是使用数据 URI 方案 http://en.wikipedia.org/wiki/Data_URI_scheme
例如,您可以使用如下所示的 HTML 的某些部分:
<img src="data:image/png;base64,
iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABGdBTUEAALGP
C/xhBQAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9YGARc5KB0XV+IA
AAAddEVYdENvbW1lbnQAQ3JlYXRlZCB3aXRoIFRoZSBHSU1Q72QlbgAAAF1J
REFUGNO9zL0NglAAxPEfdLTs4BZM4DIO4C7OwQg2JoQ9LE1exdlYvBBeZ7jq
ch9//q1uH4TLzw4d6+ErXMMcXuHWxId3KOETnnXXV6MJpcq2MLaI97CER3N0
vr4MkhoXe0rZigAAAABJRU5ErkJggg==" alt="Red dot" />
我链接到的维基百科页面上还有其他解决方案:
- 将图像包含为 CSS 规则
- 使用一些 JavaScript。
但请注意,这些解决方案并不适用于所有浏览器 - 由您根据您的具体情况决定这是否可以接受。
Edit :回答你提出的问题“如何使用 PHP 正确生成数据 URL”,看看维基百科页面下面关于数据 URI 方案 http://en.wikipedia.org/wiki/Data_URI_scheme#Inclusion_in_HTML_or_CSS_using_PHP,这给出了这部分代码(引用) :
function data_uri($file, $mime)
{
$contents = file_get_contents($file);
$base64 = base64_encode($contents);
return ('data:' . $mime . ';base64,' . $base64);
}
?>
<img src="<?php echo data_uri('elephant.png','image/png'); ?>" alt="An elephant" />
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)