1.如何調試 IE 瀏覽器
答：
- 高版本的IE（7以上）存在開發者工具，可以直接使用調試。
- 可以安裝虛擬機再安裝不同版本的IE去調試
- 在CSS中使用
border: 1px solid red;和outline:1px solid red;顯示盒模型調試 - 用IETest調試，模擬不同版本的IE瀏覽器
2.什么是CSS hack？在 CSS 和 HTML里如何寫 hack？在 CSS 中 ie6、ie7的 hack 方式？
答：
CSS hack是通過在CSS樣式中加入一些特殊的符號，讓不同的瀏覽器識別不同的符號（什么樣的瀏覽器識別什么樣的符號是有標準的，CSS hack就是讓你記住這個標準），以達到應用不同的CSS樣式的目的。
- 條件注釋法：在HTML中做更改。
在IE中生效；在IE6生效；
``````在IE7生效； - 屬性前綴法(即類內部Hack)： IE6能識別下劃線""和星號" * "，IE7能識別星號" * "，但不能識別下劃線""，IE6~IE10都認識"\9"，但firefox前述三個都不能認識。
IE6:
.box{
_background:yellow;}```
IE7:
.box{
*background:yellow;}```
- 選擇器前綴法(即選擇器Hack)：例如 IE6能識別html .class{}，IE7能識別+html .class{}或者*:first-child+html .class{}。
*html .box {
background: yellow;
}```
####3.列舉幾種 瀏覽器兼容問題
答：
* ```display:inline-block；``` 對塊級元素設置這個屬性的時候，IE67是不支持的，需要如下語句:
*display:inline;
*zoom:1;```
-
opacity:0.8;常用CSS3屬性調節透明度，這個不被IE8以下支持。所以需要：
filter: "alpha(opacity=60)"; /* IE 8 */
filter: alpha(opacity=60); /* IE 4-7 */
zoom: 1; ```
####4.針對兼容、多瀏覽器覆蓋有什么看法？**漸進增強**和**優雅降級**是什么意思？
答：一般來講，如果有超過一定百分比的人數使用某個瀏覽器，我們在設計頁面時候就要考慮到此瀏覽器的兼容問題。主要就是IE678，火狐和谷歌瀏覽器。先盡量寫代碼，如果月到一些問題可以用審查工具去看具體哪有問題，配合CANIUSE的網站查詢兼容情況，再酌情進行修改。
* 漸進增強：是指在渲染的時候先以低版本的基礎頁面為主，保證基本功能，之后再針對高版本瀏覽器中的功能屬性渲染，改進等。
* 優雅降級：與上者剛好相反，是指直接渲染網站所有功能，再對低版本的瀏覽器進行兼容。
####5.reset.css和normalize.css分別是做什么的？為什么推薦使用 nomalize.css?
答：
>在HTML標簽在瀏覽器里有默認的樣式，在切換頁面的時候默認樣式往往會給我們帶來麻煩，影響開發效率。所以解決的方法就是一開始就將瀏覽器的默認樣式全部去掉，更準確說就是通過重新定義標簽樣式。“覆蓋”瀏覽器的CSS默認屬性。最簡單的說法就是把瀏覽器提供的默認樣式覆蓋掉,這就是CSS reset。
而相對于resset.css來說，normalize.css更加柔和保留一些比較通用的瀏覽器默認樣式而不是生硬的全部去掉它們，比較講究通用和可維護性，并且修復了常見的瀏覽器Bug。所以reset用起來的時候影響的范圍很大，后者在Reset 的基礎上給一些有特殊意義的標簽加上默認樣式，所以較為推薦后者。
>1. Normalize.css 保護了有價值的默認值
Reset通過為幾乎所有的元素施加默認樣式，強行使得元素有相同的視覺效果。相比之下，Normalize.css保持了許多默認的瀏覽器樣式。這就意味著你不用再為所有公共的排版元素重新設置樣式。當一個元素在不同的瀏覽器中有不同的默認值時，Normalize.css會力求讓這些樣式保持一致并盡可能與現代標準相符合。
2. Normalize.css 修復了瀏覽器的bug
它修復了常見的桌面端和移動端瀏覽器的bug。這往往超出了Reset所能做到的范疇。關于這一點，Normalize.css修復的問題包含了HTML5元素的顯示設置、預格式化文字的font-size問題、在IE9中SVG的溢出、許多出現在各瀏覽器和操作系統中的與表單相關的bug。
3. Normalize.css 不會讓你的調試工具變的雜亂
使用Reset最讓人困擾的地方莫過于在瀏覽器調試工具中大段大段的繼承鏈，如下圖所示。在Normalize.css中就不會有這樣的問題，因為在我們的準則中對多選擇器的使用時非常謹慎的，我們僅會有目的地對目標元素設置樣式。
4. Normalize.css 是模塊化的
這個項目已經被拆分為多個相關卻又獨立的部分，這使得你能夠很容易也很清楚地知道哪些元素被設置了特定的值。因此這能讓你自己選擇性地移除掉某些永遠不會用到部分（比如表單的一般化）。
5. Normalize.css 擁有詳細的文檔
Normalize.css的代碼基于詳細而全面的跨瀏覽器研究與測試。
####6.IE盒模型和標準盒模型有什么區別? 怎樣使 IE678使用標準盒模型?box-sizing:border-box有什么作用？
答：
* IE盒模型寫出來的寬高是包括內容content和margin兩者的。而這里的content也含有border和padding。
* W3C標準盒模型是寫出來的寬高就是內容本身，我們可以在樣式里在對Margin，padding，border進行定義。
在IE678中添加DOCTYPE聲明即可遵循標準盒模型，添加box-sizing:border-box這個屬性即可以按IE盒模型來設定盒子寬高（把邊框和內邊距放在同一個外邊框里）。
####7.在 ie 6, 7, 8中展示 **盒模型**、**inline-block**、**max-width**的區別?
答：
* 盒模型
<style>
.block{
width:100px;
height:100px;
border:5px solid blue;
}
</style>
</head>
<body>
<div class="block"></div>
</body>```
經測試，IE678在盒模型無差異均為下圖所示。
IE6，7，8
-
inline-block
在IE67中不支持inline-block，IE8可以。
IE6,7
IE8
- max-width：
<style>
.block1{
max-width:200px;
height:100px;
border:5px solid blue;
}
</style>
</head>
<body>
<div class="block1"></div>
</body>```
***
****本文版權歸饑人谷_鬼腳七和饑人谷所有，轉載請注明來源。****