task12

1. 什么是 CSS hack?

由于不同厂商的浏览器，比如Internet Explorer,Safari,Mozilla Firefox,Chrome等，或者是同一厂商的浏览器的不同版本，如IE6和IE7，对CSS的解析认识不完全一样，因此会导致生成的页面效果不一样，得不到我们所需要的页面效果。这时就需要针对不同的浏览器去写不同的CSS，让它能在不同的浏览器中也能得到我们想要的页面效果。

2. 谈一谈浏览器兼容的思路?

1. 要不要做

• 产品的角度（产品的受众、受众的浏览器比例、效果优先还是基本功能优先）
• 成本的角度 (有无必要做某件事)

2. 做到什么程度

• 让哪些浏览器支持哪些效果

3. 如何做

• 根据兼容需求选择技术框架/库(jquery)
• 根据兼容需求选择兼容工具(html5shiv.js、respond.js、css reset、normalize.css、Modernizr)
• postCSS
• 条件注释、CSS Hack、JS 能力检测来做修补

3. 列举5种以上浏览器兼容的写法

1. 属性前缀法(即类内部Hack)
   例如 IE6能识别下划线""和星号" * "，IE7能识别星号" * "，但不能识别下划线""，IE6~IE10都认识"\9"，但firefox前述三个都不能认识

.box{
color: red;
_color: blue; /* ie6 */
*color: pink; /* ie67 */
color: yellow\9; /* ie/edge 6-8 */
}

2. 选择器前缀法(即选择器Hack)

3. IE条件注释法(即HTML条件注释Hack)
   针对所有IE(注：IE10+已经不再支持条件注释)： ，针对IE6及以下版本：。这类Hack不仅对CSS生效，对写在判断语句里面的所有代码都会生效

4. 以下工具/名词是做什么的

• 条件注释(conditional comment)
  条件注释 (conditional comment) 是于HTML源码中被IE有条件解释的语句。条件注释可被用来向IE提供及隐藏代码。
• IE Hack
  通过不同的代码来兼容不同版本的IE和其他浏览器。
• js 能力检测
  最常用的也是最广泛使用的客户端检测技术是能力检测（特性检测）。能力检测的目标不是识别特定的浏览器，而是识别浏览器的能力。使用这种方式无需顾及浏览器如何如何，只需确定浏览器是否支持特定的能力，就可以给出相关的方案。
• html5shiv.js
  Internet Explorer 9之前的版本几乎不支持HTML5元素和其它HTML5特性。HTML5Shiv允许Internet Explorer 9之前的版本识别HTML5标记，并允许他们使用CSS样式。
• respond.js
  Respond.js让不支持css3 Media Query的浏览器包括IE6-IE8等其他浏览器支持查询。
• css reset
  CSS Reset的作用就是清除所有浏览器默认样式
• normalize.css
  normalize.css 只是一个很小的CSS文件，但它在默认的HTML元素样式上提供了跨浏览器的高度一致性。相比于传统的CSS Reset，Normalize.css是一种现代的、为HTML5准备的优质替代方案。
  1.保护有用的浏览器默认样式而不是完全去掉它们
  2.一般化的样式：为大部分HTML元素提供
  3.修复浏览器自身的bug并保证各浏览器的一致性
  4.优化CSS可用性：用一些小技巧
  5.解释代码：用注释和详细的文档来
• Modernizr
  Modernizr是一套JavaScript 库，用来侦测浏览器是否支持HTML5与CSS3等规格。如果浏览器不支持，Modernizr会使用其他的解决方法来进行模拟。
• postCSS
  PostCSS 本身是一个功能比较单一的工具。它提供了一种方式用 JavaScript 代码来处理 CSS。它负责把 CSS 代码解析成抽象语法树结构（Abstract Syntax Tree，AST），再交由插件来进行处理。

5. 一般在哪个网站查询属性兼容性？

caniuse.com