浏览器兼容

如何调试 IE 浏览器？

• 使用IE起自带开发者工具，可以在工具中进行调试，IE6可以给元素加border来观察元素边界。
• 安装虚拟机，安装不同版本的IE的运行环境去达到调试IE浏览器的目的。
• 用js代码来进行调试。

什么是CSS hack？在 CSS 和 HTML里如何写 hack？在 CSS 中 ie6、ie7的 hack 方式？

• CSS hack:利用浏览器版本中的漏洞来编写能够适配这个版本的CSS而不影响其他浏览器的样式效果。
• hack在CSS中：

• 属性级hack。例如IE6可以识别_和*****，而IE7能够识别*****却不能识别_
  如_color:red;只在IE6下显示;*color:blue;在IE6,7下显示
• 择符级hack。例如 IE6能识别*html .class{}，IE7能识别*+html .class{}或者*:first-child+html .class{}

• hack在HTML中：

条件注释,例如:

更多hack请参考史上最全的CSS hack方式一览

列举几种浏览器兼容问题

• IE6-7不支持inline-block,一般使用display: inline;代替
• IE6不支持:hover伪类使用一般用JavaScript代替
• IE6下浮动元素双左右外边距（实际数值为设置的两倍）,可为浮动元素添加display: inline

针对兼容、多浏览器覆盖有什么看法？渐进增强和优雅降级是什么意思？

项目开始时，要首先考虑希望兼容和不予考虑的浏览器。
可以针对高端（现代）浏览器和低端浏览器（如IE6，7等）分别对待。高端浏览器实现完整的功能和特效外观，低端浏览器保证基本功能的可用性，外观不要求与高端浏览器完全一致。

• 渐进增强：优先考虑低端浏览器，先开发出兼容低端浏览器的页面后再逐渐添加高端浏览器兼容的功能和特性。
• 优雅降级：优先考虑高端浏览器，先开发出高端浏览器兼容的完整功能和特性后，再针对低端浏览器进行兼容。

reset.css和normalize.css分别是做什么的？为什么推荐使用 nomalize.css?

reset.css的目的，是将所有的浏览器的自带样式重置掉，保持各个浏览器渲染的一致性。
normalize.css的目的也是充值浏览器的自带样式，区别就是normalize是尽量保留浏览器的默认样式，不进行太多的重置。
之所以推荐使用normalize.css是因为：

• Normalize.css 保护了有价值的默认值；
• Normalize.css 修复了浏览器的bug；
• Normalize.css 不会让你的调试工具变的杂乱；
• Normalize.css 拥有详细的文档；

IE盒模型和标准盒模型有什么区别? 怎样使 IE678使用标准盒模型?box-sizing:border-box有什么作用?

• IE盒模型的宽度=内容宽度+padding宽度+border宽度,标准盒模型宽度=内容宽度
• 声明可以将ie678盒模型转为标准盒模型
• box-sizing:border-box:使元素按照ie盒模型计算，宽度=border+padding+内容宽度