瀏覽器相容問題及解決方案
1.圖片間隙
A)div中的圖片間隙（該bug出現在IE6以及更低版本當中）
描述：在div中插入圖片時，圖片會將div下方撐大三畫素
hack1：將</div>和<img>寫在一行上
hack2：將<img>轉化為塊狀元素，給<img>新增宣告：display:block;
B)dt,li中的圖片間隙(IE6)
hack1:將<img>轉化為塊狀元素，給<img>新增宣告:display:block;
hack2:<img>設定對齊方式為vertical-align:top
2.雙倍浮向（雙倍邊距）
描述:當ie6及更低版本解決浮動元素時，會錯誤的把浮向邊邊界加倍顯示
hack：給浮動元素新增宣告： display:inline
3.預設高度（IE6）
描述：在IE6及以下版本中，部分塊元素擁有預設高度（低於16px高度）
hack1：給元素新增宣告：font-size:0
hack2:給元素新增宣告:overflow:hidden;
4.表單元素行高不一致
描述：表單元素行高對齊方式不一致
hack：給表單元素新增宣告：float：left或vertical-align:top
5.百分比bug
描述：在IE6及以下版本中在解析百分比時，會按照四捨五入的方式計算從而導致50%加50%大於100%的情況
hack：給右邊的元浮動元素新增1宣告：clear：right；意思：清除右浮動，clear：left；clear：both
6.透明寫法
opacity：0~1； IE8及以上瀏覽器
fliter:alpha(opacity=1~100);IE9及IE9以下的瀏覽器
7.列表階梯bug（IE6及更低版本的瀏覽器當中）
bug1:在給的子元素中使用了Float：left；父元素沒有設定浮動屬性，li階梯效果
hack：給父元素設定浮動
bug2：當給LI裡的A轉成塊元素，並設定了固定高度，且給父元素寫了浮動後在IE6及更低版本中會出現垂直顯示
· hack：給a也設定浮動便可解決
8.滑鼠指標bug
描述：cursor屬性的head屬性值只有IE瀏覽器能識別，其他瀏覽器不識別該宣告，cursor屬性的pointor屬性值IE6.0以上版本及其他核心
瀏覽器都識別該宣告
hack：如同意某元素指標滑鼠形狀為手型，新增宣告：cursor：pointer
9.瀏覽器解析邊框按鈕時，會把邊框解析在按鈕內部，不會影響按鈕的原有大小
10.Normalize.css
不同瀏覽器的預設樣式存在差距，可以使用Normalize.css抹平這些差異，當然你也肯定定製屬於自己業務的reset.css
<link href ="https://cdn.bootcss.com/noemalize/7.0.0/normalize.min.css" rel="stylesheet">
簡單粗暴法:*{margin:0;padding:0}
11.html5shiv.js
解決ie9及以下瀏覽器對html5新增標籤不能識別的問題
12.瀏覽器相容字首
Opera:-o-
IE:-ms
Firedox:-moz-
Chrome:-webkit-
13.a標籤的幾種CSS狀態的順序
有時候我們寫好a標籤會發現寫的樣式無效，或者點選超連結後，hover，active樣式沒有效果，其實知識寫的樣式被覆蓋了
正確的a標籤順序應該是 ：==love hate == 愛恨
即.link .visited .hover .active
14.BFC解決邊距重疊問題
.當相鄰元素設定了margin邊距時。margin將會取最大值，捨棄小值，為了不讓邊距重疊，可以給子元素加一個父元素，並設定該父元素為BFC：overflow：hidden（注意：BFC為塊狀格式化上下文）
15.IE6雙倍邊距問題
ie6中設定浮動，同時有設定margin，會出現雙倍邊距的問題
hack：display：inline
16.解決IE6不支援fixed絕對定位以及IE6以下被絕對定位的元素在滾動時會閃動的問題
hack：html,html body{
background-images:url(about:blank);
background-attachment:fixed;}
html #menu{
position:absolute;
top:expression((e=document.doucumentElement.scrollTop)?e.document.body.scrollTop)+100+'px')}
17.解決IE6不支援min-height相容性寫法
min-height:350px;
_height:350px;
今天早上突發奇想看了看瀏覽器的相容問題，發現我竟然全忘光了，血慘，趕緊整篇部落格記一下子，感覺提前步入老年痴呆生活了