HTML將不會加載完整的自定義字體

我已將@font-face的自定義字體附加到本地主機頁面樣式上。我想用特殊的字體，就像阿拉伯風格，它被稱爲「阿拉伯舞蹈」。HTML將不會加載完整的自定義字體

我已經上傳正確的字體和附着在頁面的風格：

<style> 
@font-face { 
    font-family: 'ShekuFont'; 
    url('https://www.dropbox.com/s/nwefiy37mw1y2or/arabdances-webfont.woff2?dl=0') format('woff2'), 
    url('https://www.dropbox.com/s/ukkeetvypapov3j/arabdances-webfont.woff?dl=0') format('woff'), 
    url('https://www.dropbox.com/s/5j8621m4sf73n75/ArabDances.ttf?dl=0') format('truetype'); 
} 
.big-title { 
    color: #fff; 
    font-family: ShekuFont; 
    font-size: 5em; 
    font-weight: 900; 
    text-shadow: 1px 1px 2px rgba(50, 50, 50, 0.59); 
    text-transform: uppercase; 
} 
</style>

HTML：

<h1 class='big-title'>Making Test</h1>

畢竟，我可以看到一些不同的是另一種字體使用，但它不是「滿載「字體。它沒有顯示原始字體的樣式。有什麼我需要添加，所以它可以顯示原始的「阿拉伯風格」，而不是阿拉伯字體。我使用的是谷歌瀏覽器最新版本，並附有woff2，woff和truetype格式。

來源

2016-07-29 user3537210

問題是鏈接指向DropBox頁面（*.html頁面，而不是*.ttf或*.woff2或*.woff文件），而不是實際的字體文件。因此，字體實際上並未加載。相反，請將字體文件下載到您的服務器上，並使用相對路徑引用它們。

即，將字體文件下載到同一目錄中的HTML文件，然後使用這個@font-face代碼，而不是：

@font-face { 
    font-family: 'ShekuFont'; 
    url('arabdances-webfont.woff2') format('woff2'), 
    url('arabdances-webfont.woff') format('woff'), 
    url('ArabDances.ttf') format('truetype'); 
}

來源

2016-07-29 01:38:58

HTML將不會加載完整的自定義字體

回答

相關問題