-1

这是一个例子。

在此处输入图像描述

我不相信这是一个 WebKit（现在为 Chrome 闪烁）的东西，所以我假设它是一个聪明的 HTML/JavaScript/CSS 的东西。这是怎么做到的？

4

1 回答 1

1

首先，这可能是一个新的 chrome 东西.. 没有人想要这个.. 但由于答案是开放的，也许有人想尝试重新创建这个.. 这是如何完成的。

  1. 创建一个尽可能小的 html 文件
  2. 一个 16x16 png 转换为 base64
  3. 加载其余的 css 或替换现有的
  4. 加载其余的 javascript

这是我能得到的最小的转换为 base64 的 16x16 png 图像。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<style type="text/css">
body{
background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEX////MzMw46qqDAAAAEElEQVQImWNg+M+AFeEQBgB+vw/xfUUZkgAAAABJRU5ErkJggg==');
}
</style>
<script>
window.onload=function(){
 window.document.head.appendChild(CSSLINK)
 window.document.head.appendChild(SCRIPTLINK)
}
</script>
<title></title>
</head>
<body>
</body>
</html>

但是没用...

这是一个更小的 webp 图像 :) 仅适用于 chrome。

data:image/webp;base64,UklGRigAAABXRUJQVlA4IBwAAAAwAQCdASoQABAACMCWJaQAA3AA/u11j//aQAAA

ps.：至少我在base64中做了一个漂亮的16x16（2行大）棋盘png；）

于 2013-08-21T21:43:05.233 回答