浏览器兼容问题

什么是 CSS hack

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

谈一谈浏览器兼容的思路

• 以最大程度完善设计稿为基础，再考虑兼容性，不能为盲目为了兼容问题而弃用方便简洁的新方法（如html5、css3）；当然也不能用过新的技术方法使得兼容性过于低、实用性差。
• 渐进增强：针对低版本浏览器进行构建页面，保证最基本的功能，然后再针对高级浏览器进行效果、交互等改进和追加功能达到更好的用户体验
• 优雅降级：一开始就构建完整的功能，然后再针对低版本浏览器进行兼容

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

• CSS里可以给属性或者选择器写hack。属性例如：

 * background:blue;_background:red;选择器例如：* html #demo {width:120px;} *+html #demo {width:130px;} 

• HTML 针对所有IE：<![endif]-->
• IE7：*background:red;; IE8：\0background:blue;
• !important
• -webkit- ，-moz-，-ms-，-o-，针对不同浏览器的不同前缀

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

• 条件注释：条件注释是一种安全的区分IE浏览器版本的语法，是一种浏览器兼容的方法
• IE Hack：针对IE浏览器编写不同的CSS的让IE能够正常渲染的过程
• js 能力检测：不同浏览器支持的js方法不同，封装函数解决或对象解决兼容性问题
• html5shiv.js：用于解决IE9以下版本浏览器对HTML5新增标签不识别，并导致CSS不起作用的问题
• respond.js：让不支持css3 Media Query的浏览器包括IE6-IE8等其他浏览器支持查询
• css reset：把浏览器提供的默认样式覆盖掉
• normalize.css：是一个可以定制的CSS文件，它让不同的浏览器在渲染网页元素的时候形式更统一。保留有用的默认值，不同于许多 CSS 的重置；标准化的样式，适用范围广的元素；纠正错误和常见的浏览器的不一致性；一些细微的改进，提高了易用性；使用详细的注释来解释代码。
• Modernizr：提供了一种简单的方式检测任意新特性，从而让我们可以采取相应的操作
• postCSS：一个使用JS 插件来转换CSS 的工具

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

• caniuse.com