Webfont工具包顯示錯誤的字體…！

Question

我正在嘗試安裝http://www.fontsquirrel.com/fonts/lemonchicken，它看起來應該像 取自我的維護頁面，該頁面工作正常。

但是在我的實際網站上看起來像這樣

我的CSS是

/* Add font */
@font-face {
    font-family: 'lemonchickenregular';
    src: url('../font/LEMONCHI-webfont.eot');
    src: url('../font/LEMONCHI-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/LEMONCHI-webfont.woff') format('woff'),
         url('../font/LEMONCHI-webfont.ttf') format('truetype'),
         url('../font/LEMONCHI-webfont.svg#lemonchickenregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
/* Hide copyright */
.site-info {
    display:none;
}
/* Make main content area white */
.content-area {
    background-color:white;
}
/* Change all font on the website */
* {
    font-family: 'lemonchickenregular';
}

我不確定為什么它會顯示其他字體。 這與我的網站上的默認故障不同，但與我安裝的字體不同。

有任何想法嗎？

謝謝！

Answer 1

從不設置將CSS規則應用於* ，它會丟失與可能同時應用的其他規則的所有沖突解決方案，因為其他任何規則都將更加具體，包括瀏覽器指定的基本樣式規則，而這些規則將被應用。 在CSS中，任何“更具體”的選擇器都將覆蓋“不那么具體”的任何選擇器，這就是為什么p.someclass會覆蓋p ，以及為什么字面上不是* 東西都將覆蓋您在*說的話。

如果您想要所有內容的級聯規則，請在實際元素上設置規則； 為內容中最頂層的元素指定字體系列，然后為需要它的元素使用更具體的規則覆蓋它。

body {
  font-family: lemonchicken;
}