1.如何調(diào)試 IE 瀏覽器？
<li>IE7以上可以用開(kāi)發(fā)者工具進(jìn)行調(diào)試，而IE6可以使用加border的方式去調(diào)試。
<li>可以采用模擬器的方式去模擬不同版本的IE瀏覽器。例如：ietester或chrome的付費(fèi)插件Test IE。
<li>可以采用安裝虛擬機(jī)的方式，安裝不同版本的IE瀏覽器以達(dá)到不同IE瀏覽器版本的調(diào)試目的。
</br>
2什么是CSS hack？在 CSS 和 HTML里如何寫(xiě) hack？在 CSS 中 ie6、ie7的 hack 方式？
CSS hack：由于不同瀏覽器或者不同瀏覽器版本的網(wǎng)頁(yè)解析方式不同，因而導(dǎo)致CSS的輸出效果不同，而這個(gè)時(shí)候就需要CSS hack來(lái)解決局部兼容問(wèn)題，而這個(gè)過(guò)程就稱(chēng)之為CSS hack。
CSS hack：有三種方法：css屬性前綴法、IE條件注釋法和選擇器前綴法
css屬性前綴法：
.box{
color:red;/* for all browsers */
_color:red;/* for ie 6 */
*color:red;/* for ie 6-7 */
color:red\9; /* for ie 6-10 */
}
選擇器前綴法：
*body{
/* for ie 6 */
}
*+p{
/* for ie 7 */
@media screen\9{
/* for ie 6-7 */
IE條件注釋?zhuān)?/p>
<!--[if IE]>
這段文字只在IE顯示
<![endif]-->
<!--[if IE 6]>
這段文字只在IE6顯示
<![endif]-->
<!--[if gte IE 6]>
這段文字只在IE6或以上版本顯示
<![endif]-->
<!--[if lte IE 6]>
這段文字只在IE6或一下版本顯示
<![endif]-->
<!--[if !IE]>
這段文字在非IE瀏覽器上顯示
<![endif]-->
<li>ie6 hack
css屬性前綴法：
.box{
_color:red;
}
選擇器前綴法：
*box{
color:red;
}
IE條件前綴法：
<!--[if IE 6]>
<div class="box">
<![endif]-->
<li>ie 7 hack
選擇器前綴法：
*+body{
color:red;
}
IE條件前綴法：
<!--[if IE 7]>
<div class="box">
<![endif]-->
<li>ie6&ie7 hack
css屬性前綴法：
.box{
*color:red;
}
選擇器前綴法：
@media .box\9{
color:red;
}
IE條件注釋法：
<!--[if lte 7]>
<div class="box">
<![endif]-->
3.列舉幾種瀏覽器兼容問(wèn)題?
<li>不同瀏覽器的標(biāo)簽?zāi)J(rèn)的margin和padding不一，解決方案是*{margin:0 padding:0}
<li>低版本的IE瀏覽器不兼容inline-block屬性
<li>不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外邊距和內(nèi)邊距（margin和padding）不同；
<li>塊屬性標(biāo)簽float后，又有橫行的margin情況下，在IE6顯示margin比設(shè)置的大；
4. 針對(duì)兼容、多瀏覽器覆蓋有什么看法？漸進(jìn)增強(qiáng)和優(yōu)雅降級(jí)是什么意思？
兼容多瀏覽器的看法：
<li>首先看客戶(hù)需求，分析需求，得出其是否有必要兼容，針對(duì)特定瀏覽器的用戶(hù)，設(shè)計(jì)的人員，以及瀏覽器所占的市場(chǎng)份額。
<li>兼容程度，對(duì)于高級(jí)的瀏覽器，我們應(yīng)該盡可能對(duì)頁(yè)面的內(nèi)容有高的展示要求，而低版本的瀏覽器，在能夠正常展示的情況下，要求有所降低。
<li>總的來(lái)說(shuō)，需要考慮成本和效益之間的問(wèn)題。
漸進(jìn)增強(qiáng)：針對(duì)低版本的瀏覽，先實(shí)現(xiàn)基本的頁(yè)面功能，然后針對(duì)高版本的瀏覽器進(jìn)行添加頁(yè)面效果和交互等等功能，以達(dá)到更好的用戶(hù)體驗(yàn)。
優(yōu)雅降級(jí)：是基于高版本的瀏覽器實(shí)現(xiàn)各種功能之后，然后基于低版本的瀏覽器無(wú)法兼容高版本瀏覽器的功能，進(jìn)行逐步的功能和頁(yè)面效果退化，但在此過(guò)程中要保證基本的頁(yè)面功能。
5.reset.css和normalize.css分別是做什么的？為什么推薦使nomalize.css?
reset.css的目的是將所有瀏覽器的自帶樣式重置掉，這樣更易于保持各瀏覽器渲染的一致性。
normalize.css是在保持瀏覽器本身樣式的情況下，為不同瀏覽器提供通用樣式的規(guī)范，即給定通用的樣式，針對(duì)不同瀏覽器出現(xiàn)的兼容性問(wèn)題分門(mén)別類(lèi)的提供優(yōu)化方案。
normalize.css的優(yōu)勢(shì)：
1.normalize.css是一個(gè)現(xiàn)代的，為HTML5準(zhǔn)備的reset.css的替代品。它可以使元素的渲染在多個(gè)瀏覽器下都能保持一致并且符合規(guī)范。它所瞄準(zhǔn)的，也都是些需要規(guī)范化的樣式。
2.normalize.css保存了部分可用的默認(rèn)樣式。
3.normalize修復(fù)了一些常見(jiàn)的PC端及移動(dòng)端的bug，這往往超出了reset的能力范圍
借用一位知友的話說(shuō)就是，reset是革命黨，normalize是改良派。reset的方針就是都tm給我脫光光，老子今天要翻牌。什么豹紋，蕾絲，美顏相機(jī)統(tǒng)統(tǒng)給我拿掉，老子讀書(shū)少，都別騙我。于是，一個(gè)個(gè)屌絲心中的女神都重拾了素顏，但回到本真又能怎樣？那兩厘米的粉底不都是為了你？于是，在旁邊的normalize看不下去了。它主張生活不必處處追求真實(shí)，有時(shí)應(yīng)該睜一只眼，閉一只眼。
六、IE盒模型和標(biāo)準(zhǔn)盒模型有什么區(qū)別? 怎樣使 IE678使用標(biāo)準(zhǔn)盒模型?box-sizing:border-box有什么作用？
IE盒子的寬度=padding+margin+content寬度（怪異模式下）
標(biāo)準(zhǔn)盒模型下盒子的寬度=內(nèi)容寬度
通過(guò)添加doctype聲明使IE678使用標(biāo)準(zhǔn)盒模型。
當(dāng)設(shè)置了bor-sizing:border-box后,一個(gè)塊級(jí)元素實(shí)際所占寬高度= 邊界寬度(border-width) + 內(nèi)邊距（padding）+ 高度（height） / 寬度（width）
參考：
<a >CSS hack方式</a>
<a >史上最全的CSS hack方式一覽</a>
<a >
瀏覽器兼容問(wèn)題整理</a>
<a >normalize.css和reset.css的區(qū)別</a>
<a >關(guān)于css樣式的重置：Reset.css和Normalize.css</a>
版權(quán)歸饑人谷和饑人谷peter所有，若有轉(zhuǎn)載，請(qǐng)注明來(lái)源
感謝吃瓜子觀眾：
