原文地址：http://hikejun.com/demo/css/data-uri.html
http://ued.taobao.org/blog/2009/10/data-uri-try/
http://www.aoao.org.cn/blog/2010/01/fixed-mhtml-ie7-vista/
本地Demo地址：http://haiyang.me/datauri_mhtml/data-uri.html
data-uri-demo.css
/*
Content-Type: multipart/related; boundary="_"
--_
Content-Location:bg1
Content-Transfer-Encoding:base64
R0lGODlhFAAUAJEAAP/13ImwicTTs8TSsiH5BAAAAAAALAAAAAAUABQAAAJVjA2pC9ca2pkxiArGs/xeiSUV5XCPFjFMCZFT80WoCoGPmOXabMo3PQqBXKnWC7egrHLBX2L3q8R0Sx6iOETgeseaFStibWMTD+YL47yK0qDWeH0rCgA7
*/
body,
.compat-mode body{background: url(data:image/gif;base64,R0lGODlhFAAUAJEAAP/13ImwicTTs8TSsiH5BAAAAAAALAAAAAAUABQAAAJVjA2pC9ca2pkxiArGs/xeiSUV5XCPFjFMCZFT80WoCoGPmOXabMo3PQqBXKnWC7egrHLBX2L3q8R0Sx6iOETgeseaFStibWMTD+YL47yK0qDWeH0rCgA7);}
body {
*background:url(mhtml:http://hikejun.com/demo/css/data-uri-demo.css!bg1);
}
.mod{zoom:1;overflow:hidden;}
.mod .hd{position:absolute;top:0;left:0;width:100%;height:100%;_height:100em;background:#FFF;opacity:0.6;filter:alpha(opacity=60);}
.mod,.mod .bd{position:relative;z-index:1;padding:20px;}
data-uri.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf8">
<title>Data URI</title>
<link rel="stylesheet" href="data-uri-demo.css" type="text/css">
<script type="text/javascript">
window.onload = function () {
// 超坑的IE8兼容模式，居然识别*background:
if (/trident\/\d/i.test(navigator.userAgent)) {
document.body.parentNode.className = 'compat-mode';
}
};
</script>
</head>
<body>
<div class="mod">
<div class="hd"></div>
<div class="bd">
看了Stoyan的两篇文章：<br>
<a href="http://www.phpied.com/data-urls-what-are-they-and-how-to-use/" target="_blank">http://www.phpied.com/data-urls-what-are-they-and-how-to-use/</a><br>
<a href="http://www.phpied.com/mhtml-when-you-need-data-uris-in-ie7-and-under/" target="_blank">http://www.phpied.com/mhtml-when-you-need-data-uris-in-ie7-and-under/</a><br>
<p>
<a href="data-uri-demo.css">查看CSS</a>。本例的背景就是通过data URI方式。通过mhtml支持IE6/7。
</p>
<p>
用data URI的方式最大好处是减少HTTP请求。最大坏处经过Base64编码字符串很大。最好权衡着用。MHTML也是个老玩意IE很早就支持，保存页面为"Web档案"时就是这东西。没想到还可以这么应用 :)
</p>
</div>
</div>
</body>
</html>
下载地址：
Kejun的原始示例haiyang.me/datauri_mhtml/data_uri(ok1).rar
处理IE8兼容模式haiyang.me/datauri_mhtml/data_uri(ok2).rar
带旺旺点灯JS源文件haiyang.me/datauri_mhtml/data_uri(ok3).rar