CSS Hack和向后兼容的常见问题

人一旦习惯了某些东西就很难去改，以及各种各样的原因，新的浏览器越来越多，而老的总淘汰不了。增长总是快于消亡导致了浏览器兼容是成了谈不完的话题。说 到浏览器兼容，CSS HACK自然而然地被我们想起。今天，我们通常都有一个团队或者将有一个团队的人在一个公司里面做相同的事，需要我们有统一的规范来进行Coding，以 方便维护。而解决兼容的方法就是（必须是，因为这才最容易有问题的）其中一个最重要的、要解决的规范之一。

在解决兼容方法上，想定出一个统一的规范，个人认为应该以下面3点为基本原则：

权衡成本：在浏览器被淘汰后，如何快速清理掉无用代码 可维护：在资源成本和完美间平衡的向后兼容 可读：省力、易记

这里把成本放在了第一位，并不是说我们不愿意追求完美，而只是，太刻意追求完美有时候可能会阻碍我们前进；在成本后，应该是可维护和可读，这点对于团队的合作来说至关重要，而最终结果也是为了减少成本。

先把这三个原则存起来，来看看我们平时解决兼容的写法（后面会附详细的Hack方法列表）：

这种写法的优缺点是：

优点：全面，各种HACK都有；清理无用代码里易认 缺点：选择器名称不易记；代码量多（要重复写选择器） 二、CSS 属性 Hack

这种写法的优缺点是：

优点：易记；代码少 缺点：不全面 三、IE 注释

这种写法的优缺点是：

优点：安全；向后兼容好；易维护 缺点：用不好会增加HTTP请求；用得好代码又多 四、浏览器探测：/后端程序判断

这种写法的优缺点是：

优点：全面；易维护；可读性高 缺点：占资源；代码量大（要重写选择器）

上面4种是我们最常用的方法。现在，让我们抽出心里存着的那3个原则，看看如何选择。要时间思考一下么？这里简单地说一下我的选择：

尽量使用单独HACK

这样维护起来成本比较低，改动不会影响其他的浏览器，而一旦有浏览器淘汰，只要搜索关键字，就可以批量去掉这些代码。比如，ie6的单独hack：

准完美主义写法：配合IE注释，一律采用选择器HACK（选择性推荐）

然后，从第二种方式我们也可以发现。把IE注释用在body class上，而不是添加单独的

其他的就不多说了。不过，还是要提醒一下: 注释也是很重要的。虽然是HACK了，但现实中情况有时候比想象中的复杂得多，给代码一个注释，好过千言万语。

最后，还是那句，希望看到你更好的方法！