Font face 用法及全部瀏覽器支援的方法

2022-02-11 23:20:40 字數 675 閱讀 6642

:

@font-face 是乙個css2的乙個語法,它允許你在網頁上顯示乙個自定義的字型。即使客戶機器上可以沒有安裝這種字型,網頁也可以顯示。

本文將介紹@font-face的基本用法,以及在所有瀏覽器都能使用的方法。

:具體介紹請移步到這裡:

乙個例子:

font-family是字型的名稱,src是字型的路徑,可以是客戶本機字型,也可以是伺服器上的字型。

:由上面可以得出:.eot + .ttf /.otf + svg + woff = 所有瀏覽器的完美支援。

有乙個專門用於@font-face 的字型**:

fontsquirrel **提供了乙個免費的@font-face kit generator工具,可以生成不同的字型格式,並且直接用css和html給出demo。使你可以直接引用到你的**上。你可以直接使用 fontsquirrel **提供 的一些字型,也可以上傳你自己的字型還是用。

@font-face kit generator demo

@font-face kit generator demo

@font-face demo

google font api,也是乙個不錯的字型服務,另外一些字型替換還有cufon等。

google font api 可以參考之前的一片文章:

什麼是 font face及font

font face的是乙個css規則,允許你輸入自己的字型出現在 上,即使在特定的字型在訪問者的計算機上沒有安裝。這條規則程式設計客棧最重要的是,它為設計師開啟了乙個全新的世界。您可以使用任何你喜歡的字型。為什麼它是真棒 就像我說的,font face的開啟乙個全新的世界。現在,我們能夠以一種全新的...

CSS3 font face詳細用法

font face是css3中的乙個模組,他主要是把自己定義的web字型嵌入到你的網頁中,隨著 font face模組的出現,我們在web的開發中使用字型就不用再為只能使用web安全字型煩惱了!肯定會有人問,這樣的東西ie能支援嗎?我告訴大家 font face這個功能其實早在ie4就支援了,你肯定...

shape基本用法及全部屬性定義

如果你對android系統自帶的ui控制項感覺不夠滿意,可以嘗試下自定義控制項,我們就以button為例,很早以前android123就寫到過android button按鈕控制項美化方法裡面提到了xml的selector構造。當然除了使用drawable這樣的外今天android開發網談下自定義圖...