关于 CSS Hack ，目前浏览器兼容性的若干问题_html/css_WEB-ITnose

本文不考虑兼容 IE6

我是名前端实习生，刚上班没多久就遇到了一个很赶的项目，要求我为大量的页面做CSS兼容，以前我自学的时候，折腾过 CSS Hack，没想到业务中的情况更加复杂。因为工作量有点大， 而公司只有我一个前端...我怕我之前学到的皮毛不够规范、不够清晰，会带来潜在的问题，所以匆忙整理笔记的时候，发现现在网上很多CSS Hack大全之类的教程都有点旧，普遍在 IE9 之后的时间都没有更新了，所以今天来请教一下。

首先我之前学习的时候，我是把浏览器兼容分为 Firefox 标准、Chrome 标准 和 IE7 标准，一般情况下我会写一个适合 IE7 （或者说绝大部分 IE 版本）的 CSS（ .name{}），然后再根据 Firefox （ @-moz-document url-prefix(){.name{}}）或者 Chrome （ @media screen and (-webkit-min-device-pixel-ratio:0){.name{}}）去调整

所以 1、请问按照普遍网民的浏览器使用情况，我这样的分配兼容方案和CSS Hack写法合理不？如果不合理的话，应该怎么规范地分配和编写？

还有今天发现，同一个网页有个 ul 的长度，我在我的 Windows10 + IE11中是设置了宽度为 215px ，但是在经理的 Windows7 + IE11 中却短了足足 20px ，我的 IE 版本是11.192，更新版本为11.0.29，而经理的 IE 版本是 11.0 更新版本为11.0.29，难道 IE11 也有很多个版本？ 2、遇到这种情况该如何处理？

谢谢指教！

回复讨论(解决方案)

1. 实践出真知，你只有模拟不同的环境，看看能否达到这样的效果

2. 真没碰到过这样的情况，不过，你可以看看你经理的浏览器有没有放大或缩小，我曾经就碰到过类似情况，字体变大了，但表格宽度不变，结果导致标题换行，想半天没想出原因，后来一看，浏览器被放大到110%，恢复后一切正常

1. 实践出真知，你只有模拟不同的环境，看看能否达到这样的效果

2. 真没碰到过这样的情况，不过，你可以看看你经理的浏览器有没有放大或缩小，我曾经就碰到过类似情况，字体变大了，但表格宽度不变，结果导致标题换行，想半天没想出原因，后来一看，浏览器被放大到110%，恢复后一切正常

找一个 CSS Reset， 一般情况下，不用比较新的CSS属性的话，不需要自己写Hack。要么用CSS框架看看。

想问一下用什么东西可以模拟各种浏览器的环境呢

想问一下用什么东西可以模拟各种浏览器的环境呢

用  IE texter  去调试  这样就会知道每个浏览器的不同

用  IE texter  去调试  这样就会知道每个浏览器的不同

兼容性问题应当分下轻重缓急，列出最重要的来。