多个浏览器兼容性的解决小思路

在浏览器越来越多，从IE浏览器以前完全的统治着人们使用浏览器上网的行为习惯，
到目前随着Google，Firefox等其他浏览器的迅速窜起，虽然给一些厌倦了IE浏览器的人们提供了更多不同的选择，同时也给用户越来越多的DIY使用体验，但是却给页面重构工作者的工作量越来越繁重。

下面是我总结我自己对于多浏览器兼容的一些解决思路以及经验分享。由于逻辑和思路上有些混乱，所以写出来的东西也不是特别明晰，还请大家将就一些。

一，目标在不同浏览器上的位置不同的问题

1，首先，不要急着去找hack，而是看看自己写的代码有没有错误等，
2，然后，尽量让目标的位置初始化，使之在所有浏览器都处在同一个位置，这个条件的前提是，不写hack。
3，最后再一个方位一个方位调整。也就是遵循xy轴来。
4，结果可能会有1-2个像素的区别，但影响应该不大，而且也减少了hack。
说起来其实很简单，但是要做到，却是比较繁琐的一件事。

二，目标与目标之间距离在各个浏览器上的区别。

如果按照上面一的方法没办法解决，那就用背影法（自己研究出来的。）
1，给其中一个目标加上黑色背景，或则其他颜色背景，颜色自定。
2，观察黑色背景与另外一个目标的距离，查看是不是这个目标造成的距离问题
3，如果不是上一个目标，那就给另外一个目标也加上背景颜色。
4，这样很容易判断出那个目标造成的原因，就针对那个目标进行修改。还是不要写hack
5，如果2个都不是，那么可能是其中一个的margin造成原因，每个都初始化margin试试。如果还不是，那可能是中间有其他代码了。再不是，那不可能了，就是你上面的问题没排查清楚。

三，兼容问题最多的一个，浮动问题。

首先你要连接IE6.0下的3个与众不同的bug
1，因宽度等同而撑开
2，因容器浮动，不浮动的容器使用外补丁而产生的双边距离
3，左右浮动容器与中间不浮动容器的3像素距离问题。

然后就是清除浮动问题。
这个就需要比较通用兼容的代码了
.cc:after {content: “.”;display:
block;height:0;clear: both;visibility: hidden;}
.cc {display:
inline-block;}/* Hides from IE-mac */
* html .cc {height: 1%;}
.cc
{display: block;}/* End hide from IE-mac *//*清除浮动
代码*/
.c{clear:both;height:0px;font:0px/0px Arial;overflow:hidden;}

.cc就专门使用在 有浮动容器的父容器里

而.c就要按照<div class=”c”></div> 使用，中间不能放东西，主要就是
如果上面的想跟下面的分开，而不要错位，那就放到浮动容器的下面。
也有朋友提出.c里面可以放东西的，比如&nbsp;
还可以通过W3C验证。而空标签会警告提示，这些我本人没有测试过，有兴趣的朋友可以自己测试一下看看。

这里还向大家推荐一款测试网页兼容性的软件IETester，IETester支持在Windows
xp,Windows vista以及Windows 7平台上运行，你可以很容易的在IE6，IE7，IE8版本之间进行切换浏览。这个程序甚至可以并排对比两个不同的版本。而且对中文的支持也很不错。