1、如何調(diào)試 IE 瀏覽器？
- 使用高版本IE控制臺，使用開發(fā)者工具，選擇低版本IE瀏覽器。（IE7以上）
- 安裝虛擬機，在虛擬機中安裝IE 瀏覽器進行調(diào)試。
- IE6可以使用tester進行調(diào)試。
2、什么是CSS hack？在 CSS 和 HTML里如何寫 hack？在 CSS 中 ie6、ie7的 hack 方式？ - 由于不同廠商的流覽器或某瀏覽器的不同版本（如IE6-IE11,Firefox/Safari/Opera/Chrome等），對CSS的支持、解析不一樣，導(dǎo)致在不同瀏覽器的環(huán)境中呈現(xiàn)出不一致的頁面展現(xiàn)效果。
- 對CSS的支持及解析結(jié)果不一樣，以及CSS優(yōu)先級對瀏覽器展現(xiàn)效果的影響，我們可以據(jù)此針對不同的瀏覽器情景來應(yīng)用不同的CSS。
- 1、CSS hack方式一：IE條件注釋法
只在IE下生效
<!--[if IE]>
這段文字只在IE瀏覽器顯示
<![endif]-->
只在IE6下生效
<!--[if IE 6]>
這段文字只在IE6瀏覽器顯示
<![endif]-->
只在IE6以上版本生效
<!--[if gte IE 6]>
這段文字只在IE6以上(包括)版本IE瀏覽器顯示
<![endif]-->
只在IE8上不生效
<!--[if ! IE 8]>
這段文字在非IE8瀏覽器顯示
<![endif]-->
非IE瀏覽器生效
<!--[if !IE]>
這段文字只在非IE瀏覽器顯示
<![endif]-->
2、CSS hack方式二：CSS屬性前綴法
-“-″減號是IE6專有的hack
-“\9″ IE6/IE7/IE8/IE9/IE10都生效
-“\0″ IE8/IE9/IE10都生效，是IE8/9/10的hack
-“\9\0″ 只對IE9/IE10生效，是IE9/10的hack
3、CSS hack方式三：選擇器前綴法
*html *前綴只對IE6生效
*+html *+前綴只對IE7生效
@media screen\9{...}只對IE6/7生效
@media \0screen {body { background: red; }}只對IE8有效
@media \0screen\,screen\9{body { background: blue; }}只對IE6/7/8有效
@media screen\0 {body { background: green; }} 只對IE8/9/10有效
@media screen and (min-width:0\0) {body { background: gray; }} 只對IE9/10有效
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {body { background: orange; }} 只對IE10有效
參考
3、列舉幾種 瀏覽器兼容問題？
- 不同瀏覽器的標簽?zāi)J的margin和padding不同。解決方法：*{margin:0;padding:0;}
- 圖片默認有間距。解決辦法：使用float屬性為img布局
- display:inline-block;IE6 7 不兼容。解決方法：在float的標簽樣式控制中加入 display:inline;將其轉(zhuǎn)化為行內(nèi)屬性。
4、針對兼容、多瀏覽器覆蓋有什么看法？漸進增強和優(yōu)雅降級是什么意思？ - 兼容、多瀏覽器覆蓋，針對一個項目來說，如果考慮太多瀏覽器的兼容，是需要花費時間和精力來更新的，如果只有5%的人在用一種瀏覽器，就不需要兼容，例如淘寶已經(jīng)不兼容IE6，因為沒有很多人在用。所以想達到多瀏覽器覆蓋是不可能的。
- 漸進增強 progressive enhancement：針對低版本瀏覽器進行構(gòu)建頁面，保證最基本的功能，然后再針對高級瀏覽器進行效果、交互等改進和追加功能達到更好的用戶體驗。
- 優(yōu)雅降級 graceful degradation：一開始就構(gòu)建完整的功能，然后再針對低版本瀏覽器進行兼容。
- 優(yōu)雅降級是從復(fù)雜的現(xiàn)狀開始，并試圖減少用戶體驗的供給，而漸進增強則是從一個非?；A(chǔ)的，能夠起作用的版本開始，并不斷擴充，以適應(yīng)未來環(huán)境的需要。降級（功能衰減）意味著往回看；而漸進增強則意味著朝前看，同時保證其根基處于安全地帶。
參考
5、reset.css和normalize.css分別是做什么的？為什么推薦使用 nomalize.css? - reset css的目的，是將所有的瀏覽器的自帶樣式重置掉，這樣更易于保持各瀏覽器渲染的一致性；
- normalize.css的理念則是盡量保留瀏覽器的默認樣式，不進行太多的重置。
- 1保護有用的瀏覽器默認樣式而不是完全去掉它們
2一般化的樣式：為大部分HTML元素提供
3修復(fù)瀏覽器自身的bug并保證各瀏覽器的一致性
4優(yōu)化CSS可用性：用一些小技巧
5解釋代碼：用注釋和詳細的文檔來
參考
6、在 ie 6, 7, 8中展示 盒模型、inline-block、max-width的區(qū)別?
<head>
<meta charset="utf-8">
<title>測試</title>
<style>
.box1{
border: 10px solid ;
background:red;
height:100px;
width:100px;
margin:50px;
padding:50px;
}
.box2>li{
display:inline-block;
}
.box4,.box3{
display:inline-block;
}
.box5{
max-width:300px;
height:100px;
background:pink;
margin:0 auto;
}</style>
</head>
<body>
<div class="box1">盒模型</div>
<div class="box2">
<ul>
<li>box1</li>
<li>box2</li>
<li>box3</li>
</ul>
</div>
<div class="box3">你好</div>
<div class="box4">前端</div>
<div class="box5">max-width</div>
</body>
IE8
0_1458445817178_8.png
IE7
0_1458445834174_7.png
IE5
0_1458445844470_5.png
