IE7的兼容性問題

我（顯然）對Web的發展，我只是現在意識到我的網站在某些版本的IE漂亮搞砸了，但我怎麼解決這些問題？我如何知道在CSS中哪些內容需要更改，以及在多個圖層和div無法正確顯示的情況下？IE7的兼容性問題

實施例：http://www.jwstudio.us/bkpa

是否有IE CSS修復/相容性的資源？那麼Safari/Apple和Windows瀏覽器之間的定位和顏色差異呢？

來源

2011-04-10 JWStudio

一些提示：

閱讀http://quirksmode.org/ - 負載的有用的信息在那裏。

不要擔心事情究竟長得一模一樣，IE 6,7和8是非常過時的，並且有在他們的頁面呈現方式非常真實的bug。你的代碼可以是正確的，並且在IE中仍然看起來錯誤。

而是寫作<body>的，寫：

<!--[if lt IE 7 ]> <body class="ie6"> <![endif]--> 
<!--[if IE 7 ]> <body class="ie7"> <![endif]--> 
<!--[if IE 8 ]> <body class="ie8"> <![endif]--> 
<!--[if IE 9 ]> <body class="ie9"> <![endif]--> 
<!--[if gt IE 9]> <body> <![endif]--> 
<!--[if !IE]><!--> <body> <!--<![endif]-->

然後，在你的CSS，你可以寫的東西，如：

.someclass { 
    loads of normal CSS 
} 

.ie6 .someclass { 
    position:relative; 
    top:-20px; 
}

如果你想移動的東西了20像素，但只在IE6中。這可以幫助你針對舊的瀏覽器以最小的麻煩，並沒有在其他地方擔心你擰的事情了！

像ie9.js使用腳本來升級舊的IE瀏覽器使用的許多功能，從後來的IE，以及修復了一些愚蠢的錯誤。 CSSPie是獲得邊界半徑，箱陰影和漸變在這些古老的瀏覽器工作的另一種有用的工具！

顏色差異可能是因爲您的圖片包括顏色配置文件，使用類似imageoptim（OSX）剝離掉無關的信息，如本次網上敷上，或保存他們從Photoshop的Web。

希望這很有用！

來源

2011-04-10 21:34:26

下面是增加了兩個可靠的資源，以怪異模式裏奇B.提到

http://haslayout.net/css/

http://www.positioniseverything.net/explorer.html

有樂趣。 ;）

另一個更規範使用條件註釋是把鏈接，即特定的內部樣式表。（而不是改變體類，但是這是我以前沒有見過一個真正有趣的方法！）

來源

2011-04-10 21:37:22 Kerri

我更喜歡它，因爲它減少了http請求，並讓您保持一致。如果你也使用SASS，你可以解決一個問題，將其粘貼到一個混音器中，而不用再擔心它！ – 2011-04-10 22:11:35

有許多解決方案，你可以嘗試的。

首先，您可以爲Internet Explorer製作單獨的樣式表，這是我在大多數網站上所做的。你會用下面的代碼包括它：

<!-- [if IE]> 
<link type="text/css" rel="stylesheet" href="/path/to/style.css" /> 
<[endif]-->

其次，谷歌負責管理一些所謂的「瀏覽器內嵌框架」，這基本上是在IE中的Chrome瀏覽器。這對客戶端來說要求更高一些，但它修復了IE在渲染時遇到的絕大多數問題。

您可以在Chrome Frame here中找到更多信息。

編輯：

我也建議開溝支持IE6，看到瀏覽器是約10歲，大多數人現在升級。

來源

2011-04-10 23:42:58 sammarks

首先你應該使用某種類型的重置。編碼跨瀏覽器時，CSS重置會使得遊戲場更加平坦。

參見：http://developer.yahoo.com/yui/reset/

理想情況下，你要避免使用瀏覽器特有的樣式表。如果你寫得很好，你就不需要它們。

創建網站時，您應該在添加代碼時定期在每個瀏覽器中檢查它。否則，最終可能會導致代碼不佳的雪球效應。隨着您熟悉IE的怪癖，您將更有效地編寫跨瀏覽器代碼。

此外，我會避免使用這麼多的位置屬性（即「位置：相對」）。你的佈局很基礎，應該沒有這麼多的理由。如果你非常依賴他們，你應該重新考慮你如何構建你的代碼。

來源

2011-04-12 10:37:09 wdm

資源，你需要：

首先，有些網站的兼容性圖表向您展示哪些功能將在不同的瀏覽器工作：

Quirksmode.org - http://www.quirksmode.org/css/contents.html
CanIUse.com - http://caniuse.com/

接下來，去一些hacks（「Polyfils」）去提高兼容性的地方：

Modernizr的 - http://modernizr.com/
CSS3Pie - http://www.css3pie.com/
院長愛德華茲的IE7.js - http://code.google.com/p/ie7-js/
的Modernizr的Polyfills的集合 - https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-browser-Polyfills

最後，如果你不使用它已經，我推薦JQuery。這是一個Javascript庫，處理很多兼容性問題。

來源

2011-04-12 10:44:38 Spudley

IE7的兼容性問題

回答

相關問題