原文：http://designreviver.com/tips/internet-explorer-resources-for-web-developers/

在开发者与设计者眼里没有比通过IE浏览网站更糟糕的事情了，随着IE8的到来，事情有所好转，但是仍然有大量的用户在使用IE6和IE7，请升级，立刻升级！！！

IE 仍然占有绝大部分的用户，所以，很遗憾，开发者和设计者还要和他相伴工作（我非常的扫瑞啊）。

今天，我们整理了一部分很好的资源，提示和备忘录来帮助您为IE做开发。

终极 IE6 备忘录:如何解决25+ Internet Explorer 6 臭虫

CSS 在 Internet Explorer 6, 7 和 8 中的不同之处

开发者必须在所有目前使用的Internet Explorer浏览器工作中为客户的网站与个人项目进行彻底测试，保证目标拥有更广泛的受众。

本文为开发人员提供了一个详尽的，易于使用的参考，让您清楚CSS中的IE6中，IE7和IE8的支持的差异。

Internet Explorer 6, 7 和 8 通盘测试战略

这篇文章中，作者向我们展示了如何通过Microsoft提供的虚拟PC（VPC在线）和Internet Explorer VPC镜像中的应用程序兼容性来降低成本，安装多个合法版本的IE来进行测试，当您完成后，您就可以放心地测试在IE6，IE7和IE8中测试了。

经典方案 （css/jquery）

<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js”></script>
<script type=”text/javascript” src=”js/jquery.corners.js”></script>
<script type=”text/javascript”>
$(function(){
$(‘.box’).corners(’10px’);
});
</script>

<div>
<!–CONTENT–>
</div>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.corners.js"></script>
<script type="text/javascript">
$(function(){
	$('.box').corners('10px');
});
</script>

<div>
	<!--CONTENT-->
</div>

CSS3 方案

<style type=”text/css”>
.box {
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}
</style>

<div>
<!–CONTENT–>
</div>

<style type="text/css">
.box {
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}
</style>

<div>
	<!--CONTENT-->
</div>

还有附带视频

看到这篇文章以后，做下自己的整理。

在写css的过程中，Class的命名是非常重要的一项内同，简洁有语义的Class命名有利于代码的可读性。虽然伴随着HTML5的到来，会逐渐弱化，直接在HTML标签上进行简化和加强语义，但是这里还是有必要写一下。

class=”fixed”

这里是清除浮动的新写法，自动产生一个不显示的字符”.”，清除浮动，非常的实用。我自己使用class=”clearfix”

.fixed:after{
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
	}
.fixed{
	display:block;
	}
/*  \*/
.fixed{
	min-height:1%;
	}
* html .fixed{
	height:1%;
	}

class=”alt”

alt是”alternative”的缩写

#content img{
	float:left;
	display:inline;
	margin-right:10px;
	border:1px solid #ccc;
	padding:1em 0;
	background:#fff;
	}
#content img.alt{
	float:right;
	margin-right:0;
	margin-left:10px;
	}

class=”selected”

<li class=“selected”><a href="/about">About Us</a></li>

class=”first”,class=”last”

直到所有的浏览器都支持:first-child 和 :last-child属性以后，这个写法将会消失。

class=”inner”

作为内容器经常与container一起使用

<div id="container">
	<div>

	</div>
</div>

class=”even”，calss=”odd”

使用在隔行变色的li或者table tr上

<ul>

<li>Content</li>

<li>Content</li>

<li>Content</li>

<li>Content</li>

</ul>

class=”section”

替代以前常用的class=“box”

<div>
	content here...
</div>