如果你沒接觸過瀏覽器相容問題,而你又需要去解決這些問題,此時的你沒有豐富的經驗,對瀏覽器特性也不熟悉,那這篇文章或許能幫到你。
瀏覽器相容大致可以將相容問題分為三種,樣式相容,指令碼相容,指令碼操作樣式相容。
樣式相容
解決改此種問題需要的技能基礎:
1、使用debug追蹤樣式,檢視有效樣式;
2、使用w3c檢視樣式詳細資訊,包括樣式瀏覽器支援情況、屬性等引數;
3、樣式的優先順序,這能幫助你理解那個樣式是有效的,以及讓那個樣式變得有效;
解決思路:首先你應該熟悉上面的技能。當你遇到此類問題時,也有幾種情況:
1、缺少樣式限制,使用瀏覽器預設效果,導致不同瀏覽器顯示結果不一致。處理:加上必要樣式。
3、樣式不是想要的,但不方便修改。處理:利用樣式的優先順序進行覆蓋重寫。
黑科技:
1、css hack。有時我們會遇到不同的瀏覽器和不同的瀏覽器版本需要分別設定一套不同的樣式,怎樣解決這個問題呢。css hack就幫我們解決了這個問題,利用特殊字元對不同瀏覽器和瀏覽器不同版本設定專屬樣式。
介紹兩篇部落格用於入門學習
2、div塌方,內元素沒有撐開div。
.fix.fix:after
指令碼相容
需要技能:1、你需要了解dom
2、你需要懂得使用debug檢視瀏覽器的dom以及內建物件的方法和屬性。
解決技巧和思路:
指令碼相容無非是使用不支援的方法,和操作dom沒有的屬性。
這是也可以借助debug工具,利用debug工具將不同瀏覽器的物件log出來後,你就可以檢視它支援那些屬性。可見,掌握了debug工具你就已經掌握了解決眾多前端問題方法了。
指令碼操作樣式相容
這類問題在自適應方面比較常見,因為js獲取到的高度和寬度不一致引起自適應時出現滾動條之類的,這裡涉及到瀏覽器的高度演算法問題,網上有很多解決案例。
總結
解決兼用問題,首先你要判斷屬於那種型別,然後根據型別使用工具查詢原因或組織語句在搜尋引擎上快速查詢到你需要問題。不同型別的處理,上面有所描述,但未能涵蓋所有,如有更好的方式和步驟望慷慨分享。
最後勵志一下:處理瀏覽器相容並不是一件需要很多經驗和記憶,即使你是乙個小白,你都是可以解決的。
解決瀏覽器相容 CSS HACK
我們在做頁面時不可避免的會碰到瀏覽器相容問題,特別是 ie6,那麼要如何相容所有瀏覽器呢,答案是 css hack。還有一些 css hack 我沒用羅列出來,譬如 chrome,opera 等等。對於這些通常情況下我們是用不到的。測試的瀏覽器 ie6 9,firefox,chrome ps 最好的...
瀏覽器相容
瀏覽器相容問題一 不同瀏覽器的標籤預設的外補丁和內補丁不同 問題症狀 隨便寫幾個標籤,不加樣式控制的情況下,各自的margin 和padding差異較大。碰到頻率 100 解決方案 css裡 備註 這個是最常見的也是最易解決的乙個瀏覽器相容性問題,幾乎所有的css檔案開頭都會用萬用字元 來設定各個標...
瀏覽器相容
1 css bug css樣式在各瀏覽器中解析不一致的情況,或者說 css樣式在瀏覽器中不能正確顯示的問題稱為 css bug.2 css hack css中,hack 是指一種相容 css在不同瀏覽器中正確顯示的技巧方法,因為它們都屬於個人對 css 的非官方的修改,或非官方的。有些人更喜歡使用 ...