今天小编跟大家讲解下有关CSS hacker使用小结(兼容IE6、7、8) ，相信小伙伴们对这个话题应该有所关注吧，小编也收集到了有关CSS hacker使用小结(兼容IE6、7、8) 的相关资料，希望小伙伴们看了有所帮助。
什么是CSS hack 由于不同厂商的流览器或某浏览器的不同版本（如IE6-IE11,Firefox/Safari/Opera/Chrome等） 对CSS的支持、解析不一样 导致在不同浏览器的环境中呈现出不一致的页面展现效果。这时 我们为了获得统一的页面效果 就需要针对不同的浏览器或不同版本写特定的CSS样式 我们把这个针对不同的浏览器/不同版本写相应的CSS code的过程 叫做CSS hack! CSS hack的原理 由于不同的浏览器和浏览器各版本对CSS的支持及解析结果不一样 以及CSS优先级对浏览器展现效果的影响 我们可以据此针对不同的浏览器情景来应用不同的CSS。如果想系统的学习css hacker的相关资料 推荐查看这篇文章（https:///css/493362.html）。<meta http-equiv="X-UA-Compatible" content="IE=edge chrome=1">这行代码是永远以最新的IE版本模式来显示网页 使IE支持HTML5。<meta name="renderer" content="webkit">这行代码是360浏览器渲染页面需默认用极速内核<!--[if lt IE 9]> <script src="http://cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"> <script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"><![endif]-->
各浏览器CSS兼容问题汇总：https:///css/9707.html条件样式替代CSS Hacks方案：http://www.paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/建议：使用ietester软件测试IE6、7、8。顾名思义 !important的优先级要高. 举例说明：body{ background-color:#FF0000 !important; *background-color:#00FF00 !important; *background-color:#0000FF; background-color:#000000;}IE6选择最后一个 即： （因为IE6对important不感冒）IE7选择第二个 即：background-color:#000000;（因为IE7开始对important感冒了 同时还死守着它对 * 感情的最后一版本 但important并未起到优先级的作用）IE8和Firefox、Opera、Safari选择第一个 即：!important;（IE8完全感冒于important 同时丢弃了对*的感情）另外再补充一个 下划线"_",IE6支持下划线 IE7、IE8和Firefox、Opera、Safari均不支持下划线。
整理二:IE6,IE7,FireFox,Opera,Safari兼容CSS的解决方法及CSS差别
IE6,IE7,FireFox,Opera,Safari兼容CSS的解决方法及CSS差别参考网址：http://shouce.aidi.net.cn/csshack/
以下两种方法几乎能解决现今所有HACK:
1. !important随着IE7对!important的支持, !important 方法现在只针对IE6的HACK.(注意写法.记得该声明位置需要提前.)2. IE6/IE7对FireFox*+html 与 *html 是IE特有的标签, firefox 暂不支持.而*+html 又为 IE7特有标签.3.当网页在 IE 中有异常表现时 可以尝试激发 haslayout 来看看是不是问题所在。常用的方法是给某元素 css 设定 zoom:1。使用 zoom:1 是因为大多数情况下 它能在不影响现有环境的条件下激发元素的 haslayout。而一旦问题消失 那基本上就可以判断是haslayout 的原因。然后就可以通过设定相应的 css 属性来对这个问题进行修正了。建议首先要考虑的是设定元素的width/height 属性 其次再考虑其他属性。对 IE6 及更早版本来说 常用的方法被称为霍莉破解(Holly hack) 即设定这个元素的高度为 1%(height:1%;)。需要注意的是 当这个元素的 overflow 属性被设置为 visible 时 这个方法就失效了。或者使用 IE的条件注释。对 IE7 来说 最好的方法是设置元素的最小高度为 0 (min-height:0;)。 4.ie-css3.htc让IE6, 7, 8也支持CSS3圆角 阴影 文本阴影等效果。
附网址：https:///css/63281.html
5.在mozilla firefox和IE中的BOX模型解释不一致导致相差2px解决方法：div{margin:30px!important;margin:28px;} 注意这两个margin的顺序一定不能写反 据阿捷的说法!important这个属性IE不能识别 但别的浏览器可以识别。所以在IE下其实解释成这样：div{maring:30px;margin:28px;}重复定义的话按照最后一个来执行 所以不可以只写margin:XXpx!important;6.设置为float的div在ie下设置的margin会加倍。这是一个ie6都存在的bug。解决方案是在这个div里面加上display:inline。7.min-width是个非常方便的CSS命令 它可以指定元素最小也不能小于某个宽度 这样就能保证排版一直正确。但IE不认得这个 而它实际上把 width当做最小宽度来使。为了让这一命令在IE上也能用 可以把一个放到 标签下 然后为 div指定一个类：
然后CSS这样设计： selector{min-width:600px;_width:expressio n(document.body.clientWidth < 600?"600px":"auto");} 或selector { min-height:500px; height:auto !important; height:500px; }8.ie下元素消失 给该元素添加：position:relative;9.IE7浏览器下 文字越多 按钮两侧padding留白就越大 解决办法是添加overflow：visible属性。
来源：爱蒂网
