IE6、IE7、IE8共存方法

saybody

浏览: 869753 次
性别:
来自: 西安

最近访客更多访客>>

morelily

juzhibest

u012363178

wangyy

博主相关

博客

微博

相册

留言

关于我

文章分类

全部博客 (1052)

社区版块

存档分类

<h3>2009年9月3日更新</h3>
<p>
本文是较老的文章，最新的共存方法，建议使用IETester最新版。最近版IETester的下载和介绍，请阅读文章<a href="http://www.cnblogs.com/JustinYoung/archive/2009/09/03/ietester-windows7.html" title="IETester最新版">《IETester更新至v0.3.5版已经兼容Windows7（附下载地址及Debugbar插件）》</a>。
</p>

<h3>老文章正文开始</h3>
<div style="border: 1px dotted teal; font-size: 9pt; float: right; color: teal; text-align: center;">
<img alt="IE6、IE7、IE8共存" src="http://images.cnblogs.com/cnblogs_com/justinyoung/common/mulIE.gif"><br>
IE6、IE7、IE8共存</div>
<p>乱世，绝对的乱世！痛苦，无限的痛苦！无奈，绝望的无奈！现在的网页设计者无疑是web标准大时代到来之前的牺牲者。面对着众多浏览器，为了小小的页面能在各个浏览器上面展现正常，我们痛苦的忍耐和挣扎着。</p>
<p>当我们还在IE6和IE7兼容性，焦头烂额的时候，IE8又来插了一脚。这一脚，是真正的踹到了网页设计者的心窝子里，痛并快乐着……快乐，是让现在处于水深火热的网页设计者们看到了“web标准大时代”到来的可能性，但是，更多是一种痛——为了混口饭吃，我容易吗？我？</p>
<p>牢骚发完了，进入正题——</p>
<h4>IE6和IE7共存</h4>
<p>我在<a title="E6和IE7共存方法" href="http://www.cnblogs.com/JustinYoung/archive/2007/09/11/889801.html" target="_blank">《IE6和IE7共存方法（别人是别人的，我是我的）》</a>一文中，有非常详细的说明，这里就不再赘言了。</p>
<h4>IE6、IE7、IE8大团圆</h4>
<h5>第一招：以桃代李</h5>
<p>当已经有了IE6以及IE7绿色版以后，然后下载一个IE8安装程序（<a title="IE8抢先尝试——色眼窥观版（多图） " href="http://www.cnblogs.com/JustinYoung/archive/2008/03/06/eyes-on-IE8.html" target="_blank">《IE8抢先尝试——色眼窥观版（多图）》</a>一文中有最新下载地址）。安装以后，现在系统默认的浏览器变成了IE8，IE6貌似不能使用了。这时候，如果想用IE6的话，其实很简单的。只要找个用IE内核的第三方浏览器就可以了。傲游或者世界之窗都可以。可能是因为微软刚出IE8的beta1版，心里有点虚，所以，并没有强制那些使用IE内核的第三方浏览器使用IE8的内核。所以，用IE内核的第三方浏览器使用的依然还是IE6内核（前提是你安装IE8之前的时候，IE6是系统默认浏览器，而IE7是绿色版）。</p>
<h5>第二招：木牛流马</h5>
<p>第一招虽然简单，但是弊端较多。例如：如果，我已经安装了IE7浏览器（或者直接是vista操作系统），那么那些使用IE内核的第三方浏览器也已经是在使用IE7内核了，而不是IE6的内核。所以，最好的方法就是，能再来个IE6的绿色版就好了。这样，系统默认用IE8的，然后IE6和IE7用绿色的。绿色版的IE7已经有了，下载和使用方法可以从<a title="E6和IE7共存方法" href="http://www.cnblogs.com/JustinYoung/archive/2007/09/11/889801.html" target="_blank">《IE6和IE7共存方法（别人是别人的，我是我的）》</a>一文中得到。而IE6的绿色版其实也是有的，当然，这里也会提供下载——</p>
<div style="margin: 15px auto; width: 100%; height: 50px; background-color: #eeeeee; text-align: center;" class="downloadArea">
<img style="" alt="IE6绿色版下载" src="http://images.cnblogs.com/cnblogs_com/justinyoung/common/000download.gif"><a title="IE6绿色版下载" href="http://files.cnblogs.com/JustinYoung/IE6green.rar"> 点击此处下载IE6绿色版</a> </div>

<p>这样利用IE6绿色版、IE7绿色版以及IE8安装版。我们就可以让IE6、IE7和IE8共存在一个系统里面了。下面是一个示例页面，能够测试出你IE浏览器的版本哦（其实只是证明各个浏览器对CSS的支持程度）——</p>
<textarea id="txtTestCode2" cols="65" rows="12">   <!DOCTYPE html public "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="Keywords" content="YES!B/S!,web标准,杨正祎,博客园,实例代码" />
<meta name="Description" content="这是一个简单YES!B/S!文章示例页面,来自杨正祎的博客,http://justinyoung.cnblogs.com/" />
<title>YES!B/S!文章示例页面</title>
<style type="text/css">
.testIE6,.testIE7{
display:none;
}
.testIE6{
_display:block;
}
#testArea > .testIE7{
*display:block;
}
a.testIE8:before{
content:"(如果你用IE浏览器看到这个超链接，说明你的浏览器是IE8.或其他)";
}
</style>
</head>
<body>
<div id="testArea">
<a class="testIE6" href="http://www.cnblogs.com" target="_blank" title="IE6、IE7、IE8共存">
如果你用IE浏览器看到这个超链接，说明你的浏览器是IE6.或更低版本
</a>
<a class="testIE7" href="http://www.cnblogs.com" target="_blank" title="IE6、IE7、IE8共存">
如果你用IE浏览器看到这个超链接，说明你的浏览器是IE7.
</a>
<a class="testIE8" href="http://www.cnblogs.com" target="_blank" title="IE6、IE7、IE8共存">
</a>
</div>
</body>
</html>
</textarea><div style="margin-bottom: 15px; clear: both;">
<input value="运行代码" type="button"><input value="复制代码" type="button"><input value="另存代码" type="button"><span style="font-size: 9pt; color: #999999;">提示：可以先在文本框内，根据需要修改代码后再运行</span>
</div>
<p>让我们来看看最终的效果图吧——</p>
<div class="floatMPic">
<a title="IE6、IE7、IE8共存" href="http://justinyoung.cnblogs.com/" target="_blank"><img alt="IE6、IE7、IE8共存" src="http://images.cnblogs.com/cnblogs_com/justinyoung/2008_1q/testpage.gif"></a><br>
IE6、IE7、IE8共存效果图</div>
<p>想看看这个测试页面，在FireFox、Opera和Safari下的显示效果吗？展开下面的区域看看吧。FireFox、Opera和Safari果然对CSS2支持的比较好。</p>
<div class="hiddenArea">
<div id="divHaF_1" class="haContracted">
<img class="imgContracted" alt="" src="http://www.cnblogs.com/Images/OutliningIndicators/ContractedBlock.gif"><span class="showText">FireFox、Opera和Safari下的显示效果图</span>
</div>
<div id="divHaS_1" class="haExpanded">
<div class="haHiddenAreaOpration"><img class="imgExpanded" alt="" src="http://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif"></div>
<div class="haMain">
<div class="floatMPic">
<img alt="IE6、IE7、IE8共存" src="http://images.cnblogs.com/cnblogs_com/justinyoung/2008_1q/testpage2.gif"><br>
FireFox、Opera和Safari下的显示效果图</div>
</div>

</div>

</div>

<h4>相关文章列表</h4>
<ul style="margin: 15px 2px 15px 25px;">
<li><a title="E6和IE7共存方法" href="http://www.cnblogs.com/JustinYoung/archive/2007/09/11/889801.html" target="_blank">《IE6和IE7共存方法（别人是别人的，我是我的）》
    </a></li>
    <li>
<a title="IE8抢先尝试——色眼窥观版（多图） " href="http://www.cnblogs.com/JustinYoung/archive/2008/03/06/eyes-on-IE8.html" target="_blank">《IE8抢先尝试——色眼窥观版（多图）》</a> </li>
</ul>
<h4 style="font-size: 150%;">同时推荐阅读<a title="多IE版本共存的解决方案——
IETester（推荐）" href="http://www.cnblogs.com/JustinYoung/archive/2008/05/04/IETester.html">《多IE版
本共存的解决方案——IETester（推荐）》</a>
</h4>

分享到：