我的天

今天很无聊地又在虚拟机里装了一个自带IE6的XP。用的版本是（修正）金狐XP SP3 (IE6/IE8，GHO/WIM) 极致系列[4+1+1] 【唯美之最，快稳兼备】。安装很顺利，到现在为止我已经在虚拟机里安装第4个XP，第7个Windows系统了。

家里这台WIN7里有2个虚拟系统，一个是金狐的龙祥XPIE8一个是金狐修正XPIE6，开机和关机速度差不多，但开机的话，IE8的要快一点，但差距在5秒内。

你还记得IE6的icon么？左边的就是了，浅蓝色的E标志，右边的是IE8，有条黄色的带子。我还记得IE5是普蓝色没有渐变的，但IE7呢？完全没印象…… IE9的标志也是浅蓝色渐变加黄色带子，但那种立体感和IE8完全不同，E更大，更平面。

同样是纯净版，IE6和IE8的XP系统占用空间一样大。

哈哈哈，打开IE区别就明显了。IE6，把margin和负数定位视都不见。

久违了，好久好久好久都没见过IE6的标志，看到IE6，我想起那个Windows 98和Windows XP的过渡系统Windows Me。IE6曾几何时是XP的标配啊！

系统占用量，IE6比IE8少19MB。但说你也不信，它们的打开速度和载入完全速度是一样的！

仔细看进程，发现除了二者必须有的IEXPLORE.EXE外，IE8还有另外一个IEXPLORE.EXE，而那个进程就13MB了。为啥呢？我记得打开同样页面的时候IE8曾试图弹出一个窗口，那是电信ADSL的广告，但被我关掉了，难道是那个的？还是因为IE8有了选项卡功能导致2个IE进程？

无接缝界面看看IE们。

杯具的IE6啊～～～标题导航栏完全无视filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);难道IE6很傻很天真地只允许每页面使用一个滤镜？各种margin问题，用div做的hover也无法实现。除此以外，正常阅读是不受影响的，因为正文没啥花俏东西。IE6，纯粹是格式类丑一点而已。

IE8，相比IE6好多了，margin正常，hover正常，不正常的就只剩下CSS3效果——圆角、阴影等。啥？你已经觉得这已经很正常了，不知道原来这个网页还有更正常的效果？

我们用IE9来了看看吧！当然了，到现在为止IE9只能在Vista或以上系统运行。

IE9，在界面上更简洁的浏览器！默认没有菜单栏，默认标签页，默认刷新、暂停、搜索融入到地址栏。这么简洁的构造让IE的正文空间更加大。对比IE6、IE8和IE9，你会看出区别的！

对头，这就是IE9的效果！

这也是Chrome和Firefox里看到的效果。圆角、虚线（中间滑动标题导航的地方）；标题和描述下的那些导航标签有半透圆角按钮效果；页面导航按钮有阴影效果。这些都是IE9支持的CSS3做出来的。

老天啊，跨越了4代的IE才正常表现出了我要展示的东西，情何以堪。不过，如果用10年前的浏览器去测试，它们也不可能做到。（Chrome肯定没有10年，Firefox好像也没有吧……）

今天下午睡了5个小时，因为感觉没事干，现在有点痴呆，但非常满足。

追求梦想是一个永不止步的过程，正是因为期间的不容易才让一切变得不是一般的有趣。

昨天发现了IE8的问题，我开始拼死地想做IE9的网页测试。最后，我装了微软的Vitural PC 2007，虽然，那个玩意说不兼容Home Edition，然后我下载了Win7-IE8的镜像文件，在解压过程中波折重重，其中包括首先把硬盘的东西移走，然后修改临时文件夹到最后的得知解压文件大小为近9GB的时候我不得不把原来FAT32的磁盘在数据没有备份的情况下格式化为NTFS。冒了很大的风险，经历N多困难，最后当我能在虚拟机里运行出英文版Win7的时候，那个激动啊！因为我下载的是IE8，需要升级为IE9。首先我需要解决的问题就是我必须让虚拟机上网，好不容易在NAT模式下自动匹配IE上网了，用了很长时间我才明白到这样的IE9升级可以说是不可能完成的任务。

我甚至要狠心装一个虚拟机去测试网页啊！我为什么要这样呢？因为从Goolge的分析数据看来，浏览我网站的人中有40%来自IE9，我必须照顾IE9的效果，同时，在中国，IE8以下是盛行的，所以，IE6-9是我必须面对的问题。

幸好，有网友做我的坚实后盾，帮我在IE9下刷新测试。谢谢他！但，如果可以选择的话，我希望一个人能把这些测试工作都完成好。

都说IE9不理会IE从前一直使用filter，事实证明不然！IE9会CSS3，但IE9没有把filter视而不见，而是偷偷地继续调用了那个滤镜。特别，当CSS3和滤镜同时在一个class里设定的时候，它两种都用上了！恰逢，我今天用到的是CSS的垂直翻转效果。

IE9下CSS3是这么表述的：-ms-transform:translateX(-100%) rotate(-90deg);-ms-transform-origin:right top;

IE9以下的IE版本，filter是这么表述的：filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

只使用filter，IE9下是这个效果。

CSS3和filter都出现在同一个class里，IE9下是这个效果。

只使用CSS3，IE9下是这个效果。

于是，谁还敢说IE9对filter完全没feel呢？如果真的没feel，应该像Chrome或Firefox那样鸟都不鸟，但显然不是。

昨天的问题有解决思路了——精准的浏览器选择！

我一直都觉得应该把代码都写在class里，当遇到IE9的时候kill掉一些。但无论我用filter:;，filter:-;，filter:none;等都无济于事，可能filter根本只能enable和disable。后来，点点的工程师提醒了我，减法不行的话，我可以用加法！我不一定要把代码全部都写在class里，遇到IE9减去，我可以直接不在class里写filter，而当遇到IE9以下IE时再加上！

哇咔咔，就是这个思路了！

所以最终，我在主体class里去掉了filter，在文件头加上了这么一段hack。

1
2
3
4
5

<!--[if lte IE 8]>
	<style type="text/css">
		.stitch_active > h2,.stitch_header > h2{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);}
	</style>
< ![endif]-->

地球终于被拯救了！！！！在写这段hack的时候出过一个笑话，我把“lte”写成了“Ite”，幸好被点点工程师发现了！尼玛，lI1（小写L、大写i、数字一）在某些字体下真的很难分辨的说。“lte”的意思是小于或者等于。

累并快乐着真好！