2015-07-10 73 views
2

我已經按照谷歌字體網站上的指示覆蓋並且我的網頁顯示爲它應該在我的筆記本電腦上,但是,字體'FJALLA ONE'不會加載到任何其他計算機或設備上。谷歌字體不會工作

我做錯了什麼?我可以將字體存儲在文件夾中並將它們鏈接爲一個css文件嗎?

這裏是我的html - 第1部分:

head> 

<link href='http://fonts.googleapis.com/css?family=Fjalla+One' rel='stylesheet' type='text/css'> 
<link href='http://fonts.googleapis.com/css?family=Raleway' rel='stylesheet' type='text/css'> 

第2部分:

<div class="box"> 
     <h1 class="animated bounceInDown">SHEREE WALKER </h1> </div> 

我的CSS

.box h1 { 
    font-family:'FjallaOne', sans-serif; !important; 
    font-size:45px; 
    text-align:center; 
    color:#FFF; 
    padding-top: 10%; } 

我缺少的東西?任何幫助將是驚人的。我在我的智慧結束。

+0

對不起,我很困惑。你是說它在某些電腦上有效嗎?如何使用其他字體?它是否顯示在所有電腦上? – Michelangelo

回答

2

您的問題可能在這段代碼存在:

font-family:'FjallaOne', sans-serif; !important; 

應該

font-family:'Fjalla One', sans-serif !important; 

OR

font-family:'Fjalla One', sans-serif; 

如果仍不能解決問題嘗試刪除, sans-serif

+0

不幸的是它仍然無法正常工作。我真的不知道發生了什麼事。 –

+0

@ShereeWalker請檢查Mikey發佈到jsfiddle的鏈接,並確保你的外觀與他的示例相似。它可能是使它看起來不起作用的顏色。如果仍然不起作用,您是否可以提供該網頁所在位置的鏈接? – Zach

+0

其實我只是檢查了谷歌鏈接,並在你的字體家庭,你需要一個空間,所以它看起來像這樣: 'font-family:'Fjalla One';' – Zach

2

您的問題不在您的代碼中。沒事。但是我會刪除!important,但這不是必需的,語法也不正確,但即使語法錯誤,代碼仍然可以正常工作。

你真正的問題是:文本是白色的,所以你永遠不會看到它在白色背景上。你可以在這裏看到它使用紅色文字 - >http://jsfiddle.net/sxntrvrj/1/

h1 { 
    font-family: 'Fjalla One', sans-serif; 
    font-size:45px; 
    text-align:center; 
    color:red; 
    padding-top: 10%; 
} 
+0

即使在'重要'之前,它不起作用。 我剛剛上傳我的網站(未完成)看 - 當我在任何其他計算機上查看它的主標題分崩離析。它只適用於我已安裝字體的筆記本電腦。 –

+0

shereewalker.com –

+0

你知道,你不必安裝任何東西,從遠程服務器加載谷歌字體。它可以在我的電腦上正常工作。儘管sheree walker彼此重疊,但我會張貼屏幕圖像。 – Michelangelo