瀏覽器的內核分別是什麽?經常遇到的瀏覽器的兼容性有哪些?原因,解決方法是什麽,常用hack的技巧 ?
* IE瀏覽器的內核Trident、 Mozilla的Gecko、google的WebKit、Opera內核Presto;
* png24為的圖片在iE6瀏覽器上出現背景,解決方案是做成PNG8.
* 瀏覽器默認的margin和padding不同。解決方案是加一個全局的*{margin:0;padding:0;}來統一。
* IE6雙邊距bug:塊屬性標簽float後,又有橫行的margin情況下,在ie6顯示margin比設置的大。
浮動ie產生的雙倍距離 #box{ float:left; width:10px; margin:0 0 0 100px;}
這種情況之下IE會產生20px的距離,解決方案是在float的標簽樣式控制中加入 ——_display:inline;將其轉化為行內屬性。(_這個符號只有ie6會識別)
漸進識別的方式,從總體中逐漸排除局部。
首先,巧妙的使用“9”這一標記,將IE遊覽器從所有情況中分離出來。
接著,再次使用“+”將IE8和IE7、IE6分離開來,這樣IE8已經獨立識別。
css
.bb{
/*所有識別*/
.background-color:#00deff9; /*IE6、7、8識別*/
+/*IE6、7識別*/
_background-color:#1e0bd1;/*IE6識別*/
}
* IE下,可以使用獲取常規屬性的方法來獲取自定義屬性,
也可以使用getAttribute()獲取自定義屬性;
Firefox下,只能使用getAttribute()獲取自定義屬性.
* IE下,even對象有x,y屬性,但是沒有pageX,pageY屬性;
Firefox下,event對象有pageX,pageY屬性,但是沒有x,y屬性.
* (條件註釋)缺點是在IE瀏覽器下可能會增加額外的HTTP請求數。
* Chrome 中文界面下默認會將小於 12px 的文本強制按照 12px 顯示, 可通過加入 CSS 屬性 -webkit-text-size-adjust: none; 解決.
超鏈接訪問過後hover樣式就不出現了 被點擊訪問過的超鏈接樣式不在具有hover和active了解決方法是改變CSS屬性的排列順序:
瀏覽器的內核分別是什麽?經常遇到的瀏覽器的兼容性有哪些?原因,解決方法是什麽,常用hack的技巧 ?