我們可以在實踐中使用CSS 2.1選擇器嗎？

這個問題背後的罪魁禍首當然是IE6，幾乎所有人都同意網站應該支持IE6，因爲超過15％的訪問者使用它（for Yahoo it is still an A-Graded browser）。我們可以在實踐中使用CSS 2.1選擇器嗎？

IE6不支持CSS 2.1，所以我們可以在樣式表中使用CSS 2.1選擇器嗎？讓我舉一個例子：

<body> 
    <div class="header"> 
    </div> 
    <div class="content"> 
     <h1>Title</h1> 
     <p>First paragraph</p> 
     <p>Second paragraph</p> 
    </div> 
    <div class="footer"> 
    </div> 
</body>

我的CSS看起來是這樣的：

body > div {width: 760px;} /* header content and footer = 760px wide */ 
h1 + p { margin-top: 5px;} /* the first paragraph after the h1 tag should have a smaller margin */

但IE6不明白這一點，所以無論如何要瀏覽器兼容的我應該寫這樣的：

.header, .content, .footer { width:760px; }

可能我必須給第一段一些類的名稱，並在我的CSS中定義它。我可以做一個IE6 stylesheet特定的定義這些規則，但似乎是這樣的雙倍（並仍然沒有幫助，在第一段的情況下需要類名）...

來源

2009-04-28 Gidon

不是每個人都同意下，一個網站應該支持IE6。例如，我沒有。 – 2009-04-28 06:59:49

每個不是開發人員的人都同意你應該支持IE6 ....保存開發人員！ – womp 2009-04-28 06:59:51

Web開發人員可能會鄙視IE6（和IE一般，就此而言）。但是不管我們多麼討厭IE6，仍然有很大一部分人仍在使用它...... – hbw 2009-04-28 07:02:47

如果你認真對待支持IE6 100％，那麼你應該避免使用不會使用它的CSS。使用這些奇特選擇器的原因之一是讓你的生活更輕鬆，但如果你不得不爲IE6重寫它們，它不會讓你的生活更輕鬆。最後，像這樣的花式選擇器是slow in Firefox，所以也許只是一起避免它們。

來源

2009-04-28 07:02:45

Javascript like jQuery。
CSS Hack。但我不建議。因爲它不是W3C標準。
CSS Classname。通過使用CSS Classname替換CSS選擇器。

來源

2009-04-28 07:12:51

即使像w3schools這樣的'技術'網站仍然報告IE6的市場份額爲17％，你的瀏覽器受衆將決定你支持你的支持。

這就是說，如果你要支持它，顯然你需要替代品。

我讀了另一個關於只針對IE8昨天在stackoverflow有趣的線索，並且我懷疑支持每個瀏覽器會更容易，如果你可以瞄準他們。我在.NET環境和使用的方法，有人張貼了關於一半時該線程，這樣我的CSS選擇器可以很容易地變爲：

body > div {width: 760px;} 
.IE6 div.header, .IE6 div.content, .IE6 div.footer { width: 760px; }

很明顯，你會發現自己的靶向瀏覽器的方式，但CSS將等同於類似的東西。

來源

2009-04-28 07:15:04

如果你從progressive enhancement的角度來看你的網站設計，那麼你應該沒問題，因爲更現代的瀏覽器會比使用ie6更好的體驗。如果你只是想削減角落或節省開發時間，那麼你必須做出選擇，如果ie6用戶對你的網站很重要。

來源

2009-04-28 07:26:15

這不是開發者，而是網站所有者決定是否忽略IE6。您應該向網站所有者提供該特定網站的統計信息，然後做出決定。

如果你或者所有者決定不犧牲IE6人，那麼使用那些奇特的選擇器是毫無意義的。目前還有很大的缺點，並且沒有上行空間。

來源

2009-04-28 08:17:26 allesklar

對於我的網站上的每個IE6用戶，我都有一個很大的紅色警報，他們的瀏覽器很古老，他們應該下載一個真正的瀏覽器，比如Firefox;]這就是解決方案。如果網站管理員不會對用戶說，誰會呢？

來源

2009-04-28 08:22:27 Thinker

我認爲「支持」IE6的概念是錯誤的想法，如果我們說不，我們只是不會允許IE6用戶訪問我們的網站和內容？當然不是。所以問題的關鍵是，你想花多少時間讓IE6的瀏覽器像其他瀏覽器一樣使用網站的體驗。

我自己的觀點是，我「支持」IE6，因爲IE6的用戶將能夠訪問網站的所有內容及其所有功能，但他們可能無法獲得與Firefox 3相同的視覺或交互體驗用戶。

所以要回答你的問題，是的，我們可以使用CSS 2.1和3.0選擇器來實現某些效果，只要內容仍然存在於IE6中並具有可接受的視覺外觀即可。什麼是可以接受的將取決於項目（可能是客戶！）。

你的例子是一個很好的展示：

p { margin-top: 10px; } 
h1 + p { margin-top: 5px;} /* the first paragraph after the h1 tag should have a smaller margin

這裏IE6仍然會得到該段的內容，仍然會有他們之間的所有重要的空白，他們只是將不會減少第一個間距。這對於減少HTML中的混亂是一個公平的妥協方案。

另一個很好的例子是圓角。您可以使用-moz-border-radius和-webkit-border-radius來獲得Firefox和Safari中的圓角，從而增強您網站的視覺體驗，但IE用戶仍然可以獲得內容，儘管只有普通的舊方角（然後有很多JavaScript解決方案可以實現這一點對於啓用了JavaScript的人員）。

這一切都會在標題Progressive Enhancement

來源

2009-04-28 12:22:02 roryf

我們可以在實踐中使用CSS 2.1選擇器嗎？

回答

相關問題