2014-09-03 120 views
-3

在Windows上使用谷歌字體有一些已知的錯誤?谷歌字體 - windows

<link href='http://fonts.googleapis.com/css?family=Raleway:400,300,700,500' rel='stylesheet' type='text/css'> 


/* RALEWAY */ 
/* latin */ 
@font-face { 
    font-family: 'Raleway'; 
    font-style: normal; 
    font-weight: 300; 
    src: url(http://fonts.gstatic.com/s/raleway/v9/-_Ctzj9b56b8RgXW8FAriQsYbbCjybiHxArTLjt7FRU.woff2) format('woff2'); 
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000; 

}

字體Raleway沒有任何瀏覽器上顯示,僅適用於Chrome瀏覽器。

CSS:

.s11-col-title span{font-weight:300;font-family:"Raleway";font-size:42px;letter-spacing: -2px;} 

也許Firefox和IE不支持woff2?

+0

您是否嘗試通過CSS調用HTML元素? – ZombieCode 2014-09-03 00:39:29

回答

2

不知道更多你試圖做什麼,我會閱讀如何實際執行此操作。這裏是Mozilla開發者網絡的鏈接。

Mozilla Font Face

最主要的是,你需要把它添加到HTML元素。

HTML元素:

<h2>New Font is Used</h2> 

CSS電話:

h2 { font-family: Raleway; } 

更新:

你字型調用不正確。

@font-face { 
    font-family: 'Raleway'; 
    font-style: normal; 
    font-weight: 500; 
    src: local('Raleway Medium'), local('Raleway-Medium'), url(http://fonts.gstatic.com/s/raleway/v9/CcKI4k9un7TZVWzRVT-T8xsxEYwM7FgeyaSgU71cLG0.woff) format('woff'); 

}

下面是一個例子:Code Pen

更新2:

這裏是鏈接調用應該是什麼樣子

<link href="http://fonts.googleapis.com/css?family=Raleway:400,300,700,500" rel="stylesheet" type="text/css" /> 

這裏是另一個例如:Code Pen Example #2

刪除你的手糊貼,只使用谷歌的代碼。不要使用你的代碼,這是錯誤的。

+0

是的,我把它添加到元素更新的問題 – Wordica 2014-09-03 00:45:45

+0

什麼是不正確的?我從谷歌網站 – Wordica 2014-09-03 01:01:23

+0

http://fonts.googleapis.com/css?family=Raleway:400,300,500,700 – Wordica 2014-09-03 01:02:36

0

我問你爲什麼你甚至需要首先@ font-face。谷歌字體爲你做到了。你只需要在你的 文件頭的鏈接,然後在你的類聲明中使用的字體名稱:

<!DOCTYPE html> 
    <html> 
    <head> 
     <link href='http://fonts.googleapis.com/css?family=Raleway:400,300,700,500' rel='stylesheet' type='text/css'> 
    ... 

,然後在你的樣式表:

.s11-col-title span { 
    font-weight:300; 
    font-family:"Raleway"; 
    font-size:42px; 
    letter-spacing: -2px; 
} 

,你應該是好去...