數位行銷

解決IE8背景圖片錯位和不顯示的問題

最近新設計了一個宣傳產品的網頁,當覺得一切都沒有問題的時候,然後再IE8中打開這個網頁測試的時候,返現網頁的整個背景圖片都錯位1px左右,雖然是一個很小的錯誤,但是對於一個WEB開發者來說是無法容忍的事情。可奇怪的是這個網頁在IE6IE7Firefox這些主流流覽器下卻能夠很正常的顯示。更奇怪的是,我用IETester測試工具在IE8模式下測試又沒有錯位的現象,徹底被IE8流覽器搞糊塗了。雖然IE8還包含有很多的小問題,但是相比IE6IE7還是非常優秀的。

 

 以下是我在製作網頁時遇到的一個問題:

目前,隨著IE8的發佈,網頁相容問題有面臨一次挑戰,當我們辛辛苦苦製作出的網頁,在IE6IE7下顯示正常,但卻在IE8下顯示不正常了,可能你會說,添加一段代碼,可以行的,但卻有時會出現意外,比如當你為子容器添加了float後,你有為父容器添加了一個背景圖片,在IE6IE7下父容器的背景圖片顯示很正常,但在IE8下,父容器的背景圖片不見了,怎麼回事?

 

大家知道,現在的IE8越來越接近WEB標準了,所以對於不規範的寫法他會不正常的顯示,或變形、或移位、或……。

 

我們發現在IE8下不能顯示背景圖片的原因是因為子容器使用了float浮動而沒有真正閉合,這也是div無法自適應高度的一個原因。如果父div沒有設float而其子div卻設了float的話,div無法包住整個子DIV,這種情況一般出現在一個父DIV下包含多個子DIV

解決辦法:給父DIV也設上float,即可解決父容器下背景圖片顯示問題。

 

和其他流覽器相比,IE系列在HTML標準方面確實表現的糟糕透了,雖然微軟推出了最新版的IE8,並沒有給WEB開發者帶來多大的驚喜,但是為了滿足眾多被因壟斷而使用系統預裝IE的廣大用戶,在設計網頁的時候IE8也是我們不得不重點相容的物件。希望在今年微軟即將推出的IE9流覽器能夠帶我們更多的驚喜。

最新文章

原創、翻譯及轉貼的資訊都在這裡。

網站是實現夢想的工具! 開始準備建置您的網站了嗎? 加Line好友
益盛科技

我們重視設計質感與行銷價值

。網頁設計。程式設計。Joomla教學。

 

聯絡資訊

ring@des13.com

點此加我們LINE  @igodos 加line好友

406台中市北屯區文心路四段955號11樓之2(需預約諮詢)

04-37072202 /  0919-413187 

thedes13 

 
OMO電商 社群整合,輕鬆提升5倍轉換率,追蹤客戶行為,自動化行銷!想了解,快與我們聯絡! ×
點此加我們LINE 連結line帳號
DMC Firewall is developed by Dean Marshall Consultancy Ltd