CSS 字型嵌入

2021-05-27 22:31:11 字數 1005 閱讀 5691

css的說明文件裡有這樣一段:

@font-face版本:css2  相容性:ie4+

語法:@font-face

取值:name  : 字型名稱。任何可能的 font-family 屬性的值

url ( url )  : 使用絕對或相對 url 位址指定opentype字型檔案

srules  : 樣式表定義

說明:設定嵌入html文件的字型。此規則無預設值。

此規則使你能夠在網頁上使用客戶端本地系統上可能沒有的字型。 url 位址必須指向 opentype 字型檔案(.eot或.ote)。此檔案包含可以轉換為 truetype 字型的壓縮字型資料,可以用來提供html文件使用該字型,或取代客戶端系統已有的同名字型。此檔案可以使用 microsoft weft 工具製作。

這樣,我們需要微軟的weft工具來完成。

字型嵌入演示

使用教程(e文)

簡單說明一下:   先新建乙個htm空文件,然後開啟weft,根據嚮導,新增剛才新建的htm檔案

然後下一步,會提示程式將分析系統字型,此時不要勾選skip analysis,繼續下一步,等程式掃瞄完畢,出現乙個對話方塊,此時先不著急下一步,點"add"按鈕,選擇乙個需要製作的字型,只有truetype的字型可以被製作,選好後下一步。   接著選擇,生成的eto字型檔案的儲存位置   下面這個選框比較重要,第一次就是因為沒弄清楚,導致無效。這裡要輸入字型允許被使用在哪些站點內。這個地方建議輸入兩個網域名稱,乙個是:

做為本機測試用,另乙個是自己的站點的位址,如:

設定好後,再下一步直到完成。   這樣還不算完,找到生成好的eot檔案,放在**目錄裡,在需要使用這個字型的頁面裡,按照下面的方法操作。

測試文字

最後要注意的是在@font-face的時候,font-family最好自己定義乙個字型名稱,不要跟本機的字型名稱一致。否則在的時候,如果eot字型載入失敗,有可能會使用系統字型來顯示,這樣自己就無法判斷是否css字型載入成功。其實,字型是否載入成功,在安裝了weft後,會自動彈出提示。

Flex字型篇 動態嵌入字型 按需嵌入

接上篇 flex字型篇 動態嵌入字型 按需嵌入 中文字型小的幾m,大的十幾m,如果把整個中文字型都嵌入到swf會使容量增大,不利於網路傳輸,這時應該採取按需嵌入的辦法,只把使用到的字元才嵌入到字型swf裡。按需嵌入的字型樣式 需要編譯的css檔案 wb fz22.css generate by wi...

Flex 動態嵌入字型

flex編譯器,位於flex sdk的bin目錄,例如 flash builder 4 sdk 3.5 c program files adobe adobe flash builder 4 sdks 3.5.0 bin 編譯器的詳細使用說明參考官方文件using the flex compiler...

css字型樣式

注 以下的字型樣式只可在ie中使用。刪除線刪除線 加上背景色 加上背景色 左右翻轉效果 左右翻轉效果 上下翻轉效果 上下翻轉效果 發光文字效果 發光文字效果 發光文字效果 發光文字效果 發光文字效果 發光文字效果 發光文字效果 發光文字效果 發光文字效果 發光文字效果 發光文字效果 發光文字效果 發...