IE8適配總結(一)

2021-08-18 22:42:05 字數 1567 閱讀 8343

前端的適配主要包括各個瀏覽器和不同版本之間的適配,重點考慮ie8,所以這裡總結幾個目前知道的ie8適配方面的知識。

很多html5新增的標籤在ie8中都不支援,比如header、section、footer等。

例如下面在html檔案中簡單的使用上面提到的這幾個標籤,看下在ie8和其他版本中的效果。

html**:

lang="en">

charset="utf-8">

titletitle>

header

section

footer

style>

head>

this is header

header>

this is section

section>

this is footer

footer>

body>

html>

在ie9中的效果如下:

在ie8中的效果如下:

可以看到這幾個標籤在ie8中並沒有效果,因為ie8對它們不提供支援。

flex和之前android用到的布局方式很相似,所以理解起來很簡單,但因為很多不支援,所以 就很少使用了。還是通過**來看下在ie8下的效果。

html**:

style="display: flex;justify-content: center;align-items: center;width: 200px;height: 200px;background: red">

style="width: 50px;height: 50px;background: aquamarine">1div>

style="width: 50px;height: 50px;background: yellow">2div>

style="width: 50px;height: 50px;background: mediumvioletred">3div>

div>在ie10和ie8中的的效果分別如下:

可以看出flex布局在ie8 甚至ie9中都不支援的。

rgba(255,255,255,0.5)這樣的半透明設定在ie8中也是不生效的。

如 border-radius這種設定圓角非常方便的也不支援

ie8完全不支援**查詢,但可以通過respond.js檔案使其支援。具體使用方式:

為ie8單獨編寫css檔案然後引入 :

實戰除錯IE8

乙個瀏覽器相容性bug所想到的文中提到了ie8有些特殊的地方,對於開發人員來說,最大的問題是無法除錯。關於ie8的更多資訊,參見ie 8 不得不說的七件事 針對ie8這個例子,我們可以考慮使用windows為應用程式提供的特殊除錯能力,系統自動除錯設定,配置如下 1 在登錄檔hkey local m...

處理ie8相容

1.ie8換成edge模式渲染 x ua compatible content ie edge 2.x ua compatible是針對ie8新加的乙個設定,對於ie8之外的瀏覽器是不識別的,這個區別與content ie 7 在無論頁面是否包含指令,都像是使用了 windows internet ...

如何刪除IE8

之前安裝了一下ie8 beta2感受了一下新的功能。執行起來也挺不錯的,但當我公升級到ie8 rc版本的時候問題就非常的多,不知道是不是公升級的問題,每次關掉ie都會報乙個錯誤,非常的鬱悶。而且在使用bs系統的時候也會報一些錯誤,然後就不能正常工作了,實在是沒有辦法,特別是給客戶演示系統的時候出現錯...