爲什麼Firefox忽略我的全局指定字體？

希望它讓我的網頁看起來一樣在現代瀏覽器，我包括一些reset.css下列行爲什麼Firefox忽略我的全局指定字體？

body { 
    *font-size: small; 
    font-family: arial,helvetica,sans-serif; 
    font: 16px/18px sans-serif; 
    margin: 0 auto; 
}

然而，字體在我的Firefox 20（對Ubuntu的規範 - 1.0）仍然由少數比我的Chromium 25.0.1364.160 Ubuntu 10.04更大。有趣地，下面的規則幫助：

* { 
    font-family: arial,helvetica,sans-serif; 
}

它看起來像火狐覆蓋字體爲跨度，太多，但我不能看到它的Web開發工具。它只是選擇了不同的字體，儘管它不應該。

我創建了一個plunk顯示它（只需放下明星規則以查看更改）。我的問題是

這是什麼解釋？
什麼是重置樣式的正確方法？我們是否真的需要明星規則以防萬一？

來源

2014-07-08 maaartinus

你想做什麼與重置，你是設置字體大小，然後覆蓋它，然後設置字體家庭，然後覆蓋它。這沒有意義 – svendjokumsen

@svendjokumsen你不得不問復位的作者，而不是我。不知道它來自哪裏，它是衆多公共領域之一'reset.css'。 – maaartinus

既然您選擇使用它，我認爲您已經知道它做了什麼。 – svendjokumsen

解釋是，font: 16px/18px sans-serif將字體系列設置爲sans-serif，這是一個依賴於瀏覽器的默認sans serif字體。它覆蓋前面的font-family設置。顯然，在您的Firefox中，sans-serif被映射爲字體比Arial更小的字體，字體大小相同。所以字體大小是一樣的，字母只是更小。

最簡單的解決方法是恢復兩個聲明的順序：

body { 
    font: 16px/18px sans-serif; 
    font-family: arial,helvetica,sans-serif; 
    margin: 0 auto; 
}

（該*font-size黑客是沒有意義在這裏，因爲你有一個規則後，設置字體大小）

或者，你可以結合規則：

body { 
    font: 16px/18px arial,helvetica,sans-serif; 
    margin: 0 auto; 
}

的問題「？什麼是重置樣式有道」主要意見爲基礎，也indepen提出技術問題。在body上設置字體屬性並不是真正的「重置樣式」，只是普通的樣式。從技術上講，設置例如所有元素上的font-family都會產生相當大的影響，並且只有在您確實瞭解其影響（例如，在表單域上，像code等元素上）時才應該這樣做。

來源

2014-07-08 19:33:14

爲什麼Firefox忽略我的全局指定字體？

回答

相關問題