1.什么是 CSS hack

• 由于不同廠商的瀏覽器，比如Internet Explorer,Safari,Mozilla Firefox,Chrome等，或者是同一廠商的瀏覽器的不同版本，如IE6和IE7，對CSS的解析認識不完全一樣，因此會導(dǎo)致生成的頁面效果不一樣，得不到我們所需要的頁面效果。
• 這個時候我們就需要針對不同的瀏覽器去寫不同的CSS，讓它能在不同的瀏覽器中也能得到我們想要的頁面效果。
• CSS hack就是運用一些小技巧，利用不同瀏覽器的特性（或者BUG）來使我們的代碼兼容不同的瀏覽器。
• CSS Hack大致有3種表現(xiàn)形式
  • CSS屬性前綴法
  • 選擇器前綴法以
  • IE條件注釋法（即HTML頭部引用if IE）

注：實際項目中CSS Hack大部分是針對IE瀏覽器不同版本之間的表現(xiàn)差異而引入的。

2.談一談瀏覽器兼容的思路

• 要不要做
  • 產(chǎn)品的角度（產(chǎn)品的受眾、受眾的瀏覽器比例、效果優(yōu)先還是基本功能優(yōu)先）
  • 成本的角度 (有無必要做某件事)
• 做到什么程度
  • 讓哪些瀏覽器支持哪些效果
• 如何做
  • 根據(jù)兼容需求選擇技術(shù)框架/庫(jquery)
  • 根據(jù)兼容需求選擇兼容工具(html5shiv.js、respond.js、css reset、normalize.css、Modernizr)
  • postCSS
  • 條件注釋、CSS Hack、js 能力檢測做一些修補

3.列舉5種以上瀏覽器兼容的寫法

1. 合適的框架

   • Bootstrap (>=ie8)
   • jQuery 1.~ (>=ie6), jQuery 2.~ (>=ie9)
   • Vue (>= ie9)

2. 條件注釋

   • 條件注釋 (conditional comment) 是HTML源碼中被IE有條件解釋的語句。條件注釋可被用來向IE提供及隱藏代碼。

   <!--[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]-->
   

注： IE10不再支持條件注釋

3. CSS hack

• CSS屬性前綴法
  • 例如 IE6能識別下劃線""和星號" * "，IE7能識別星號" * "，但不能識別下劃線""，IE6~IE10都認識"\9"，但firefox前述三個都不能認識

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

• 選擇器前綴法

• IE條件注釋法

<!–-[if IE 7]>
<link rel="stylesheet" href="ie7.css" type="text/css" />
<![endif]–->

4. IE條件注釋法結(jié)合選擇器整體優(yōu)化
5. 利用一些和兼容相關(guān)的開發(fā)利器

• 比如 html5shiv.js ，Modernizr，respond.js，css reset，normalize.css等

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

• 條件注釋
  • 是HTML源碼中被IE有條件解釋的語句。條件注釋可被用來向IE提供及隱藏代碼。(ie 10不再支持)
• IE Hack
  • 使用特殊符號或者方法寫出只有IE某個版本的瀏覽器才可以解析的代碼，主要有CSS屬性前綴法，選擇器前綴法以及IE條件注釋法。
• js 能力檢測
  • 用js識別瀏覽器是否支持特定的能力。
• html5shiv.js
  • 針對不支持HTML5標簽的瀏覽器，創(chuàng)建并模擬HTML5標簽的效果并使相應(yīng)的CSS生效。
• respond.js
  • 模擬CSS3的媒體查詢，讓不支持CSS3 Media Query（媒體查詢）的瀏覽器支持查詢。
• css reset
  • 通過重新定義標簽樣式，覆蓋瀏覽器自帶的默認CSS屬性。
• normalize.css
  • 保護有用的保護有用的瀏覽器默認樣式而不是完全去掉它們
  • 把很多屬性的樣式做一個統(tǒng)一化
  • 修復(fù)瀏覽器自身的bug，并保證各瀏覽器的一致性
  • 優(yōu)化CSS可用性。
  • 用注釋和詳細的文檔來解釋代碼
• Modernizr
  • 一個用來檢測瀏覽器功能支持情況的 JavaScript 庫。通過這個庫我們可以檢測不同的瀏覽器對于HTML5和CSS3特性的支持情況。并以類標識的方式添加到標簽中。
• postCSS
  • PostCSS 是一個使用 JS 插件來轉(zhuǎn)換 CSS 的工具。這些插件可以支持使用變量，混入(mixin)，轉(zhuǎn)換未來的 CSS 語法，內(nèi)聯(lián)圖片等操作。

5.一般在哪個網(wǎng)站查詢屬性兼容性？

• 瀏覽器市場份額
• 查CSS屬性兼容
• 查Hack的寫法