什么是 CSS hack
不同瀏覽器的核心解析認識不一樣供炎，造成同一段代碼在不同瀏覽器最終的頁面不一樣。這時候需要針對不同的瀏覽器寫不同的CSS，或者使CSS兼容不同的瀏覽器，使得頁面能得到我們想要的結(jié)果伪货。
談一談瀏覽器兼容的思路
要不要
做產(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 能力檢測做一些修補
列舉5種以上瀏覽器兼容的寫法
- 條件注釋
| 項目 | 范例 | 說明 |
|-|-|
|！ | [if !IE] | 非IE |
| lt | [if lt IE 5.5] | 小于IE 5.5|
| lte| [if lte IE 6] |小于等于IE6|
| gt |[if gt IE 5] |大于 IE5|
| gte| [if gte IE 7] |大于等于IE7|
| | |[if (IE 6)|(IE 7)] |IE6或者IE7|
屬性選擇器
.box{ color: red; _color: blue; /*ie6*/ *color: pink; /*ie67*/ color: yellow\9; /*ie/edge 6-8*/ }
inline-block: >=ie8 min-width/min-height: >=ie8 :before,:after: >=ie8 div:hover: >=ie7 inline-block: >=ie8 background-size: >=ie9 圓角: >= ie9 陰影: >= ie9 動畫/漸變: >= ie10
以下工具/名詞是做什么的
- 條件注釋
條件注釋 是于HTML源碼中被 IE 有條件解釋的語句蜓谋。條件注釋可被用來向 IE提供及隱藏代碼梦皮。 條件注釋最初于微軟的 Internet Explorer 5瀏覽器中出現(xiàn)，并且直至 Internet Explorer 9 均支持桃焕。微軟已宣布于IE10停止支持剑肯。 - IE Hack
針對不同的瀏覽器寫不同的CSS，或者使CSS兼容不同的瀏覽器观堂，使得頁面能得到我們想要的結(jié)果让网。 - js 能力檢測
瀏覽器的能力檢測目標不是檢測特定的瀏覽器，而是檢測瀏覽器的能力师痕。這樣溃睹，只需要檢測瀏覽器是否支持特定的能力，就可以給出特定的解決方案胰坟。這一部分檢測是解決瀏覽器兼容問題的主要檢測因篇。 - html5shiv.js
在使用html5的時候，有些瀏覽器不支持h5的一些新特性和標簽笔横，需要用這個html5shiv.js來模擬這些標簽竞滓。 - respond.js
在做響應(yīng)式網(wǎng)頁的時候一些瀏覽器器不支持媒體查詢等css3新特性，使用respond.js來兼容吹缔。 - css reset
將瀏覽器的默認樣式全部去掉商佑，更準確說就是通過重新定義標簽樣式∠崽粒“覆蓋”瀏覽器的CSS默認屬性茶没。更簡單的說法就是把瀏覽器提供的默認樣式覆蓋掉肌幽！這就是CSS reset。 - normalize.css
Normalize.css 是一個可以定制的CSS文件礁叔，它讓不同的瀏覽器在渲染網(wǎng)頁元素的時候形式更統(tǒng)一牍颈。
它可以：
保留有用的默認值，不同于許多 CSS reset 的簡單粗暴琅关。
標準化的樣式煮岁，適用范圍廣的元素。
糾正錯誤和常見的瀏覽器的不一致性涣易。
一些細微的改進画机，提高了易用性。
使用詳細的注釋來解釋代碼新症。 - Modernizr
Modernizr 使你可以方便地為各種情況編寫 JavaScript 和 CSS步氏，無論瀏覽器是否支持這些特性。這是處理漸進增強的完美方案徒爹。
Modernizr 會在頁面加載后立即檢測特性荚醒；然后創(chuàng)建一個包含檢測結(jié)果的 JavaScript 對象，同時在 html 元素加入方便你調(diào)整CSS 的 class 名隆嗅。 界阁。 - postCSS
它可以被理解為一個平臺，可以讓一些插件在上面跑胖喳，它提供了一個解析器泡躯，可以將CSS解析成抽象語法樹，通過PostCSS這個平臺丽焊，我們能夠開發(fā)一些插件较剃，來處理CSS。熱門插件如autoprefixer技健，它可以幫我們處理兼容問題写穴，只需正常寫CSS，autoprefixer可以幫我的自動生成兼容性代碼
