瀏覽器核心及相容問題

2021-08-29 18:22:25 字數 1991 閱讀 2178

① * : ie6,ie7可以識別;

② _和- : ie6可以識別;

③ !important :表示高優先順序,ie7及以上,firefox都支援,ie6認識帶!important的樣式屬性,但不認識!important的優先順序;

④ 引擎字首 -ms- -moz- -o- -webkit-

詳見:

ie可以使用parentelement獲得父結點,parent.children得到結點的所有孩子結點。firefox不支援。

解決方法:使用parentnode和parent.childnodes。

firefox使用xmlhttprequest,ie使用activexobject。

解決方法:

else if (window.activexobject)③事件繫結

addeventlistener(「click」, function, true)相容firefox、chrome、safari、opera、ie9+

attachevent(「onclick」, function) 相容ie7,8

解決:

function add(obj,event)

else

}

阻止冒泡

event.stoppropagation()不相容ie6-8

event.canclebubble = true相容ie

解決:

function stop(event)

else }

瀏覽器    	核心	         瀏覽器引擎字首

ie瀏覽器 trident -ms-

firefox gecko -moz-

safari webkit -webkit-

opera blink -o-

chrome webkit(原)、blink(現 -webkit-

主要的需要新增瀏覽器引擎字首(vendor-prefix)的屬性包括:

• @keyframes

• 移動和變換屬性(transition-property/duration/timing-function/delay)

• 動畫屬性 (animation-name/duration/timing-function/delay)

• border-radius

• box-shadow

• backface-visibility

• column屬性

• flex屬性

• perspective屬性

注意:不帶字首的必須放在最後

捕獲事件

ff沒有setcapture()、releasecapture()方法

ie中的解決方法 obj.setcapture(); obj.releasecapture();

火狐中的解決辦法:

window.captureevents(event.mousemove|event.mouseup);

window.releaseevents(event.mousemove|event.mouseup);

if (!window.captureevents) else

if (!window.captureevents) else

CSS及瀏覽器相容問題

css 框模型概述 元素框的最內部分是實際的內容,直接包圍內容的是內邊距。內邊距呈現了元素的背景。內邊距的邊緣是邊框。邊框以外是外邊距,外邊距預設是透明的,因此不會遮擋其後的任何元素。內邊距 邊框和外邊距都是可選的,預設值是零。但是,許多元素將由使用者 樣式表設定外邊距和內邊距。可以通過將元素的 m...

瀏覽器相容問題

我經常看到一些人提問說網頁錯位,和在火狐裡面看上去網頁是好的,在ie在錯位了.在web 下html css裡全看一些關於這些問題.還有有ul li什麼調整不好的.等等 全可以用css hack 解決的.解決方法 用positon relative 然後 top 0px left 0px 上面的top...

瀏覽器相容問題

給近兩天的工作乙個總結,給這週劃上句號。工作中遇到了在google顯示的很好的介面,在ie顯示的不是很好,但還能看,僅僅是顏色和和位置錯位,在360瀏覽器下看就是真的錯誤太大了,不顯示,樣式也亂了,於是走上解決瀏覽器相容之路。思路1 對應每個瀏覽器寫個css,判斷之,工作量太大,放棄。思路2 針對每...