任务13：浏览器兼容

1.如何调试 IE 浏览器？

（1）使用高版本IE的控制台；
（2）border: 1px solid red;
（3）online: 1px solid red;
（4）javascript: alert(document.get...)

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

CSS hack：

由于不同的浏览器，甚至同一浏览器的不同版本对CSS的解析认识不一样，导致显示的页面效果不一致，写出针对不同浏览器CSS code的过程。

写 hack：

（1）CSS 内部hack；
（2）选择器hack；
（3）HTML 头部引用。

在 CSS 中 ie6、ie7的 hack 方式：

（1）IE6能识别下划线""和星号""，IE7能识别星号""，但不能识别下划线""，IE6~IE10都认识"\9"，但firefox前述三个都不能认识。
（2）IE6能识别html .class{}，IE7能识别+html .class{}或者*:first-child+html .class{}。
（3）IE条件注释法:
只在IE6下生效

只在IE6以上版本生效

3.列举几种 浏览器兼容问题

（1）inline-block:IE6、IE7不支持该属性，IE8以上支持，应该改为：

display: inline-block;
*display: inline;
zoom: 1;

（2）ie6横向margin加倍，解决方法：display：inline；
（3）ie6中不支持透明度rgba与opacity设置方法，解决方法：
opacity:0.6->filter:alpha(opacity=60)

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

看法：由于有不同浏览器的厂商，浏览器厂商就会制定出自己的一套规范，从而渲染页面的方式也有所不同，由以前的不统一到现在出来了w3c规范，这样就比以前更统一了，但每个浏览器厂商都有自己稳定的客户，也需要满足用户群体的需求，呈现的页面效果不能太大，所以就需要兼容。当然兼容、多浏览器覆盖也是不能避免的，尽量做到页面效果近似相同。
渐进增强：一开始只构建站点的最少特性，然后不断针对各浏览器追加功能。
优雅降级：一开始就构建站点的完整功能，然后针对浏览器测试和修复

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

reset.css：是将所有的浏览器的自带样式重置掉，这样更易于保持各浏览器渲染的一致性。
normalize.css：是把所有的元素样式回归本该是的样子，并且消除了不同浏览器之间默认样式的区别。
目的：
（1）保护有用的浏览器默认样式而不是完全去掉它们
（2）一般化的样式：为大部分HTML元素提供
（3）修复浏览器自身的bug并保证各浏览器的一致性
（4）优化CSS可用性：用一些小技巧
（5）解释代码：用注释和详细的文档来

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

IE盒模型：content 的width部分包含了border、padding及content。
标准盒模型的范围包括了margin、border、padding、content。content 部分就是content的width。
在html最前面添加声明，使 IE678使用标准盒模型。
作用：此元素的内边距和边框不再会增加它的宽度，也就是说使盒模型变为IE盒模型。

7.在 ie 6, 7, 8中展示 盒模型、inline-block、max-width的区别

虚拟机安装

虚拟机.png

IE6

ie6.png

IE7

ie7.png

IE8

ie8.png