html5知識點：多終端瀏覽器兼容

時間 2019-11-29

標籤 html5 html 知識終端瀏覽器兼容欄目 HTML5 简体版

原文原文鏈接

什麼是多終端？前端

多終端就是包括了咱們的電腦，手機，手持式移動設備好比

ipad等。

由於各種設備的顯示屏幕大小不一，分辨率不一，最佳可視效果的橫豎設置也不同，因此多終端瀏覽器兼容主要就是學習如何讓咱們的項目在多終端上呈現相同的顯示效果，它主要涉及到兩塊知識點。

一、瀏覽器兼容web

二、寬高自適應chrome

1、瀏覽器兼容

什麼是瀏覽器兼容？

在咱們的實際開發中會涉及到在多個瀏覽器好比

firefox，opera，chrome，或者IE的多個版本下進行調試，在不一樣版本瀏覽器下會出現顯示效果不一的狀況，而瀏覽器兼容就是爲了處理這種狀況。

瀏覽器最重要或者說核心的部分是

「Rendering Engine」，可大概譯爲「渲染引擎」，不過咱們通常習慣將之稱爲「瀏覽器內核」。負責對網頁語法的解釋（如標準通用標記語言下的一個應用HTML、JavaScript）並渲染（顯示）網頁。因此，一般所謂的瀏覽器內核也就是瀏覽器所採用的渲染引擎，渲染引擎決定了瀏覽器如何顯示網頁的內容以及頁面的格式信息。不一樣的瀏覽器內核對網頁編寫語法的解釋也有不一樣，所以同一網頁在不一樣的內核的瀏覽器裏的渲染（顯示）效果也可能不一樣，這也是網頁編寫者須要在不一樣內核的瀏覽器中測試網頁顯示效果的緣由。

主要瀏覽器內核有哪些？

一、Trident內核表明產品Internet Explorer，又稱其爲IE內核。Trident（又稱爲MSHTML），是微軟開發的一種排版引擎。使用Trident渲染引擎的瀏覽器包括：IE、傲遊、世界之窗瀏覽器、Avant、騰訊TT、Netscape 八、NetCaptor、Sleipnir、GOSURF、GreenBrowser和KKman等。瀏覽器

二、Gecko內核表明做品Mozilla FirefoxGecko是一套開放源代碼的、以C++編寫的網頁排版引擎。Gecko是最流行的排版引擎之一，僅次於Trident。使用它的最著名瀏覽器有Firefox、Netscape6至9。ide

三、WebKit內核表明做品Safari、Chromewebkit 是一個開源項目，包含了來自KDE項目和蘋果公司的一些組件，主要用於Mac OS系統，它的特色在於源碼結構清晰、渲染速度極快。缺點是對網頁代碼的兼容性不高，致使一些編寫不標準的網頁沒法正常顯示。主要表明做品有Safari和Google的瀏覽器Chrome。學習

四、Presto內核表明做品OperaPresto是由Opera Software開發的瀏覽器排版引擎，供Opera 7.0及以上使用。它取代了舊版Opera 4至6版本使用的Elektra排版引擎，包括加入動態功能，例如網頁或其部分可隨着DOM及Script語法的事件而從新排版。測試

五、Blink由Google和Opera Software開發的瀏覽器排版引擎，2013年4月發佈。firefox

CSS Bug、CSS Hack和Filter開放源代碼

CSS Bug：CSS樣式在各瀏覽器中解析不一致的狀況，或者說CSS樣式在瀏覽器中不能正確顯示的問題稱爲CSS bug.指針

CSS Hack：CSS中，Hack是指一種兼容CSS在不一樣瀏覽器中正確顯示的技巧方法，由於它們都屬於我的對CSS代碼的非官方的修改，或非官方的補丁。有些人更喜歡使用patch(補丁)來描述這種行爲。

Filter：表示過濾器的意思，它是一種對特定的瀏覽器或瀏覽器組顯示或隱藏規則或聲明的方法。本質上講，Filter是一種用來過濾不一樣瀏覽器的Hack類型。

常見

CSS解析Bug及hack

圖片間隙：主要解決插入圖片以後在圖片下方多出

3像素的問題

雙倍浮向：當

Ie6及更低版本瀏覽器在解析浮動元素時，會錯誤地把浮向邊界加倍顯示。