指定爲瀏覽器的CSS規則，不支持特定的CSS屬性

我有定義不支持字體拉伸性能（webkit的，等等）的瀏覽器CSS規則問題的方法...指定爲瀏覽器的CSS規則，不支持特定的CSS屬性

的問題：我使用Helvetica Neue字體（從Twitter Bootstrap設置CSS），我在我的一些CSS規則中使用font-stretch:condensed;屬性。不幸的是，我很快就發現這個屬性在Webkit和其他一些瀏覽器中不被支持，我開始尋找一個後備規則。

找到一個解決方案here for webkit瀏覽器是使用後腳本字體名稱font-family: "HelveticaNeue-CondensedBold","Helvetica Neue",Helvetica,Arial,sans-serif;。但它確實只有Mac解決方案。 Windows瀏覽器不會有這種字體，並且會回退到非拉伸字體。

所以使用濃縮字體的唯一真正的解決方案是從像myfonts.com，谷歌webfonts等網站導入字體...因爲我正在尋找一個免費的解決方案，我發現一些免費的字體接近Helvetica Neue Bold濃縮。我現在想知道有沒有一種方法來指定一個CSS規則，只針對不支持font-stretch屬性的瀏覽器？

來源

2012-05-29 Primoz Rome

嗯，你可以用JavaScript檢查，如有不支持該屬性加載額外的樣式，但我想這不是你想要的答案嗎？ – primavera133

我能想到的唯一辦法，是JavaScript的功能檢測：

if (document.createElement("detect").style.fontStretch === "") { 
    document.getElementsByTagName("html")[0].className += " fontstretch"; 
}

在<head>標籤添加此。

這會fontstretch類添加到您的html標記，以便您可以：

設置的@ font-face規則爲標準 - 這將是瀏覽器的回退不支持font-stretch
使用.fontstretch作爲css鉤子將字體族重新設置爲Helvetica Neue並應用font-stretch。

來源

2012-05-29 09:32:39 Luca

是的，但不想這樣...更新：第二個想法，這不完全是這樣一個不好的解決方案。 –

它可能是唯一可行的，但我同意它不完美，因爲它不適用於JS關閉。 – Luca

我來到翻過一個有意義的解決方案時，我正在尋找別的東西，它允許你指定你的CSS文件中使用.ie9 .yourclass.chrome .yourclass等瀏覽器特定的CSS。它採用了可在_layout文件或masterpage文件中加載一個小的JavaScript文件..

這種聯繫是Here

來源

2013-09-14 20:38:29 Skindeep2366

指定爲瀏覽器的CSS規則，不支持特定的CSS屬性

回答

相關問題