Ba la la la ~ 讀者朋友，你們好啊雳锋，又到了冷鋒時間，話不多說羡洁，發(fā)車玷过！
1.<!DOCTYPE HTML>文檔類型的聲明。
產生條件：
IE6瀏覽器筑煮，當我們沒有書寫這個文檔聲明的時候辛蚊，會觸發(fā)IE6瀏覽器的怪異解析現(xiàn)象；
解決辦法：書寫文檔聲明真仲。
2.不同瀏覽器當中袋马，很多的標簽的默認樣式不同，如默認的外部丁內補丁秸应。
產生條件：不同瀏覽器虑凛；
解決辦法：利用CSS reset文件進行樣式的清除，然后再根據(jù)需要進行設置软啼。
html{font-family:"微軟雅黑",Arial,sans-serif}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,form,fieldset,input,button,textarea,p,th,td{padding:0;margin:0;font-family:Microsoft YaHei,sans-serif,Arial}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}a{text-decoration:none;color:#000;outline:none}li{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit}input,button,textarea,select{*font-size:100%}a{-webkit-transition:all 0.5s linear;-moz-transition:all 0.5s linear;-ms-transition:all 0.5s linear;-o-transition:all 0.5s linear}
為防止不同瀏覽器默認樣式對于網(wǎng)頁布局樣式造成的影響桑谍，通常我們在
HTML文件的頭部引入上面這段重置代碼，將一些瀏覽器所不同的樣式以及部分標簽的默認樣式清除掉祸挪。
3.橫向雙倍外邊距
產生條件：在
IE6中塊元素浮動后锣披，會出現(xiàn)橫向雙倍
margin現(xiàn)象。
解決辦法：
在float標簽的樣式控制中加入display：inline
IE6存在不少的兼容問題，今天要說的是IE6 的 橫向雙倍外邊距
橫向雙倍外邊距的觸發(fā)條件：
當浮動元素的浮動方向和浮動邊界的方向一致雹仿。此時用
IE6查看網(wǎng)頁增热，就會發(fā)現(xiàn)，設置的橫向的邊距變成了雙倍胧辽。
如：元素向左浮動并且設置了左側的外邊距出現(xiàn)了這樣的雙邊距
bug峻仇。同理，元素向右浮動并且設置右邊距也會出現(xiàn)同樣的情況票顾。同一行如果有多個浮動元素础浮，第一個浮動元素會出現(xiàn)這個雙邊距bug，其它的浮動元素則不會奠骄。
那么，如何修正這個
IE6下的橫向雙倍外邊距的Bug呢番刊？
只需要給浮動元素加上
display:inline;的CSS屬性就可以了含鳞。
4.默認行高
產生條件：
IE6、IE7芹务、遨游瀏覽器蝉绷；設置的文字高度超出盒模型內容區(qū)域設置的高度時會影響布局。
解決辦法：給超出高度的標簽設置
overflow：hidden枣抱；或者將文字的行高line-height設置為小于塊的高度熔吗。
5.img外部的border
產生條件：
img外部有a標簽，即img標簽有鏈接時
解決辦法：設置
img邊框border:0;
**6.圖片默認有間距佳晶。
產生條件：
img標簽（每個img之后敲了回車）
解決辦法：為
img設置float的浮動布局方式桅狠。
7.經(jīng)典3像素bug
產生條件：
IE6瀏覽器，浮動塊元素與未浮動塊元素處于同一行轿秧，有默認的3px間距中跌。
解決辦法：設置非浮動元素浮動。
8.默認行高
產生條件：清除浮動的時候菇篡，有些人會采取一種
清浮動的方法**漩符，使用一個空的
div，然后為這個div設置{clear：both}驱还。在大部分瀏覽器當中嗜暴，這樣做是沒有任何問題的，但是在IE6瀏覽器當中议蟆，div即使是空的闷沥，也會存在默認行高。
解決辦法：設置其高度為0咪鲜，并設置overflow:hidden狐赡。{height:0;overflow:hidden;clear:both;}
選擇清浮動位置時應注意以下：
1、清浮動一定要在浮動標簽完成浮動布局以后添加，否則會影響到浮動標簽布局颖侄；
2鸟雏、清除浮動必須與前面的標簽屬于同級關系。
①clear屬性定義了元素某個方向上不允許出現(xiàn)浮動元素：
none
（允許兩邊都可以有浮動對象）
/left（…）/right（不允許右邊有浮動對象）/both（不允許有浮動對象）;
②空標簽清除浮動：在HTML頁面中加入一個空標簽用來清除浮動览祖。
HTML：
<div class="clear"> </div>
CSS:.clear{clear:both;hegiht:0;overflow:hidden;}
clear:both;是清除所有浮動孝鹊；
height:0;overflow:hidden;是用來改變IE6下標簽有默認的低于10px的行高時將以10px的高度顯示的bug。
但是空標簽清浮動會增加多余的代碼展蒂。
③overflow：在需要清除浮動的腹肌標簽中加入overflow即可又活，在IE6中不認識此屬性則加入zoom：1;或者height：1%;css樣式改為：.out{overflow:auto;zoom:1;}
該屬性對于父標簽設置的高度小于子標簽時，IE6/7锰悼、遨游則以下拉框形式出現(xiàn)柳骄，而火狐、谷歌箕般、歐鵬耐薯、IE8會將子標簽超出部分隱藏掉。
overflow:visible屬性只能對IE6/7丝里、遨游起作用曲初，對火狐、谷歌杯聚、歐鵬臼婆、IE8無清浮作用。
overflow:visible(不剪切內容也不添加滾動條)/auto（是body對象和textarea的默認值幌绍，在需要時剪切內容并添加滾動條）/hidden（超出部分隱藏）/scroll（總是顯示滾動條）;
④after清浮動：
css樣式為：
.out{zoom:1;}/==for IE6/7 Maxthon2==/
outer:after {clear:both;content:"";visible:hidden;display:block;}/==for FF/chrome/opera/IE8==/
其中
clear:both;只清除所有浮動颁褂；content:"";display:block;對于FF/chrome/opera/IE8不能缺少，content（）可以取空值纷捞。
⑤子標簽浮動時痢虹，給父標簽浮動
⑥下一標簽直接清浮動：兄弟標簽浮動時，下一標簽直接寫入清除clear：both主儡；就可以奖唯。
⑦使用position：absolute；清除浮動糜值。
9.a標簽hover不適用于所有標簽
產生條件：
IE6瀏覽器中hover只支持a標簽的使用丰捷，不支持一切其它標簽使用；
解決辦法：合理用
a標簽嵌套其他行內標簽或者用javascript模擬a的hover效果寂汇；詳情請查看日志：兼容IE6 a標簽hover效果**
10.table標簽當中border-color屬性設置無效
產生條件：
IE6中table設置屬性border-color無效病往；
解決辦法：運用
CSS樣式進行控制，而不是使用屬性進行樣式的處理骄瓣。
11.png格式圖片
產生條件：
IE6瀏覽器停巷，不支持透明；
解決辦法：使用
javascript進行處理；或者使用gif畔勤、jpg圖像替代掉png圖片的使用蕾各。
12.透明rgba與opacity
產生條件：
IE6****,7,8****不支持此兩種透明的設置方法；
解決辦法：使用
IE6當中的濾鏡filter替代掉庆揪，如：opacity:0.6;filter:alpha(opacity=60)式曲。
以上為個人意見，如有雷同缸榛，純屬巧合吝羞，歡迎大家多提意見！Bey 了 個 Bey ~
