2013-01-10 51 views
5

下面是一個簡單的CSS是否可以指定Google字體的自定義名稱?

h1 { 
    font-family: 'header-font', arial, sans-serif; 
} 

p { 
    font-family: 'paragraph-font', arial, serif; 
} 

是否有可能加載任何遠程谷歌字體(讓我們說「拉託」),使其在CSS的姓是「標題的字體」?

編輯:這背後的想法是能夠輕鬆地交換WP主題中的字體。不幸的是,在我的情況下,在CSS預處理器中使用變量不是一種選擇。

+1

你爲什麼要這樣做?如果用戶具有與您的自定義字體名稱匹配的本地字體,是否不會引起問題? – drmonkeyninja

+0

[Google字體:在CSS中定義自定義名稱]的可能重複(http://stackoverflow.com/questions/28172964/google-fonts-define-custom-name-in-css) – Gajus

回答

-1

是的,當您在@ font-face樣式聲明中定義字體系列並使用該名稱稍後在樣式表中引用它時,您可以提供任何名稱。

@font-face 
{ 
    font-family: whateverYouWant; 
    src: url('example.ttf'), 
     url('example.eot'); 
     ... /* and so on */ 
} 

無論你如何在font-family屬性中指定樣式,它將如何從文檔的其餘部分引用它。然而,我不知道它如何與本地字體文件競爭(所以如果你試圖命名自定義字體宋體,我不知道你會得到什麼 - 自定義字體或真正的宋體)。無論如何,我不知道你爲什麼要這樣做。

+3

這隻適用於在本地存儲字體。谷歌字體有一個預定義的名稱。 – azzy81

+1

不,這會起作用。注意你的名字'font-family'確保是唯一的,可能有一個像'font-family:'abcweb-header-font;''這樣的網站標識符。 http://codepen.io/anon/pen/hAvcp – Jen

+1

那麼谷歌字體集成在哪裏? – Richard

2

我不認爲你能說實話。當您查看谷歌字體時,Google字體具有預定義的名稱。看到這個例子:http://fonts.googleapis.com/css?family=Akronim

它的名字被設置爲'Akronim',我不認爲你可以通過任何其他名稱引用它。

相關問題