CSS hack

1.什么是CSS hack？

为了让不同的浏览器呈现尽可能一样的效果而用的一些非常规的手段。打个比方来说就是一个箱子没有锁，那怎么打开它呢？只能撬开或者劈开这个箱子了。所以，我们在写页面的时候尽量少用Hack，尽量用CSS的原义写代码。

Hack 可以分别在HTML和CSS中使用,在HTML中我们也叫条件注释。我们先看在HTML中的写法

    <!--[if IE 6]>
    <p>You are using Internet Explorer 6.</p>
    <![endif]-->
    <!--[if !IE]><!-->
    <script>alert(1);</script>
    <!--<![endif]-->
    <!--[if IE 8]>
    <link href="ie8only.css" rel="stylesheet">
    <![endif]-->

CSS hack 在CSS中主要使用属性前缀的方法，比如
1. IE6能识别下划线"_"和星号" *"，IE7能识别星号" "，但不能识别下划线""，IE6~IE10都认识"\9"，等等。
2. IE6 .selector { -property: value; }
IE7 .selector { *property: value; }
IE6-8 .selector { property: value\9; }

2.几种 浏览器兼容问题

第一个比如display:inline-block
在IE6、7上就不支持
这时候 我们就得用hack技术

.selector{
display:inline-block;
*display:inline;
}

再比如 min/max-width/height,明显不支持IE6、7,这时候我们用height的属性，虽然效果会有些差别，但是好过基本上呈现的效果差不多。也符合我们优雅退级的原则。

.selector{
min-height:300px;
*height:300px;
}

参考饥人谷课件

3. 渐进增强和优雅降级是什么意思？

优雅降级 在现代的浏览器上正常的开发，实现任务中样式和功能。然后再去测试 IE 6 7 8 只要页面还不乱就可以，不一定要做到还原度尽量一致。

渐进增强 和优雅降级相反，主要先在IE6、7的古老的浏览器上先开发，然后完成功能后，再在现代的浏览器上开发，然后可以适当的添加一些效果。

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

CSS Reset 是革命党，CSS Reset 里最激进那一派提倡不管你小子有用没用，通通给我脱了那身衣服，凭什么你 body 出生就穿一圈 margin，凭什么你姓 h 的比别人吃得胖，凭什么你 ul 戴一胳膊珠子。于是 *{margin:0;} 等等运动，把人家全拍扁了。看似是众生平等了，实则是浪费了资源又占不到便宜，有求于人家的时候还得贱贱地给加回去，实在需要人家的默认样式了怎么办？人家锅都扔炉子里烧了，自己看着办吧。

Normalize.css 是改良派。他们提倡，各个元素都有其存在的道理，简单粗暴地一视同仁是不好的。body 那一圈确实挤压了页面的生存空间，那就改掉。士农工商，谁有谁的作用，给他们制定个规范，确保他们在任何浏览器里都干好自己的活儿。

原文地址

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

IE盒模型
IE678怪异模式（不添加 doctype）使用 ie 盒模型，宽度=边框+padding+内容宽度

标准盒模型
chrome， ie9+, ie678(添加 doctype) 使用标准盒模型， 宽度= 内容宽度

box-sizing:border-box 设置的宽高将包含 边框及 padding