HTML5 Boilerplate <head>腳本和移動設計

最近我遇到了HTML5 Boilerplate並喜歡它！但是有一部分我不明白。HTML5 Boilerplate <head>腳本和移動設計

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

Paul Irish表示，我們可以使用它來代替條件樣式表和CSS黑客。有沒有人有這方面的經驗，就像我閱讀他的博客一樣，我仍然無法理解它。

現在我正在使用CSS3媒體查詢，但它不在IE中工作，我只是一個幸運的和CSS3-mediaqueries.js文件（或類似的東西）和respond.js文件只是不不爲我工作。所以我決定有條件的評論或特定的樣式表適合我，但我記得這個設置，但真的不知道如何使用它。

任何幫助非常感謝！

來源

2012-02-05 kia4567

這些就是所謂的條件註釋。它們不是任何標準的一部分。

IE是一件有趣的事情 - 它實際上解析了什麼應該是非活動數據的文本！但它應該工作。

您使用這種方式很簡單：如果您使用的是IE < 7，那麼您將blah元素設置爲.ie6 blah。一個更具體的例子：比方說，你希望你的超鏈接在用戶使用IE8時是紅色的，否則是綠色的。下面是一些CSS：

a { 
    color: green; 
} 

.ie8 a { 
    color: red; 
}

由於「a這是具有ie8類元素的後代」更具體的比「任何a」，後者適用於在IE8中的鏈接會變成紅色。此邏輯僅適用於IE8，因爲這是IE8的條件註釋被解釋爲HTML的一部分（而不是註釋掉）的唯一情況。

唯一可能會造成混亂其他的一點是，最後一行，在那裏你有一個-->內註釋塊：這意味着瀏覽器完全不顧條件註釋仍然會看到在過去的塊中的HTML（沿IE> 9和非IE-but-still-interpreting-conditional-comments瀏覽器）。

來源

2012-02-05 04:30:54 Borealid

這是一個很好的方式來風格的IE瀏覽器，而不是我的媒體查詢？因爲它是現在，如果你在任何IE版本（當然除了IE 9）去我的網站，你會看到移動版本的樣式。不知道爲什麼。你可以幫我解決這個問題，如果我給你的鏈接指向我的網站，那麼你可以看看它可能在做什麼？這是我第一次爲手機和平板電腦用戶使用HTML 5和風格，所以這是一個很大的混亂。 – kia4567 2012-02-05 04:35:38

@AmberGoodwin這是一種很好的IE風格。我不太瞭解IE特有的行爲（我總是爲W3C標準編寫代碼），告訴你爲什麼你的網站表現不好，除了建議你把文檔中的第一件事情放在<！DOCTYPE html>之外。抱歉。 – Borealid 2012-02-05 04:39:35

那好吧。我很欣賞答案。我會全速前進。謝謝！ – kia4567 2012-02-05 04:49:56

HTML5 Boilerplate <head>腳本和移動設計

回答

相關問題