怎么用@font-face實(shí)現(xiàn)網(wǎng)頁特殊字符

這篇文章主要介紹怎么用@font-face實(shí)現(xiàn)網(wǎng)頁特殊字符，文中介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們一定要看完！

　　前幾天寫了篇文章，就是用css來實(shí)現(xiàn)三角箭頭，雖然達(dá)到需要的效果了，但還是有一些問題，比如依舊需要靠position來定位箭頭的位置。而且目前也只能實(shí)現(xiàn)三角箭頭，若想用一些其他的字符，還是得用圖片。于是最近一直在尋找更好的辦法，最終被我找到了……

　　首先，我們?nèi)盤Fonts文件夾里找到WEBDINGS.TTF字體，復(fù)制到桌面。接下來，我們需要一個(gè)軟件，就是“fontforge”，它可以實(shí)現(xiàn)制作自定義字體的功能，我們后面就要用它來做一個(gè)適用于我們自己的字體庫。

　　下載好后解壓，把WEBDINGS.TTF字體復(fù)制到里面，運(yùn)行fontforge.bat并選擇字體文件，然后出現(xiàn)這個(gè)界面：

　　很多圖形字符吧，是不是發(fā)現(xiàn)很多字符以前都用到過，只不是那時(shí)是用圖片來實(shí)現(xiàn)的？

　　接下來我們要做的就是選擇需要的字符，存到另一個(gè)字體文件里，因?yàn)閃EBDINGS.TTF這個(gè)文件里的大多數(shù)字符都是用不到的，所以直接用這個(gè)文件來當(dāng)我們的字符庫有點(diǎn)略大，所以我們只需選擇我們需要的就行，操作上我們先新建一個(gè)空白的字體文件，點(diǎn)File->New，然后選擇需要的字符，并復(fù)制到新建的字體文件中，如：

　　然后保存，選擇Generate Fonts：

　　然后設(shè)置保存為.ttf結(jié)尾的文件：

　　這樣，我們的字體文件就做好了。但是，還沒有結(jié)束，因?yàn)镮E只認(rèn)識(shí).eof，不認(rèn)識(shí).ttf，所以我們還需要生成其他的字體文件，關(guān)于這個(gè)問題，我很早寫過篇文章，操作方法都有說明，就不具體介紹了，文章鏈接：《網(wǎng)頁中使用任意字體之實(shí)際操作》。

　　最后，如果你覺得操作太麻煩，可以下載我整理的一個(gè)字符庫，主要是以箭頭為主，因?yàn)樘Ｓ昧恕?br/>　　下載地址

　　總的來說，這個(gè)東西雖然會(huì)增加加載頁面文件的總大小，但是如果有自己的字符庫，操作性會(huì)更加多元化。因?yàn)槲覀兛梢钥刂谱址拇笮　㈩伾?，甚至還有陰影、翻轉(zhuǎn)等css3效果，而圖片如果要換個(gè)顏色，就必須修改，或者重新制作一張，可塑性不強(qiáng)。

　　PS：我的EonerCMS里，窗口右上和右下的按鈕都已經(jīng)換成字符了，效果挺不錯(cuò)的

以上是“怎么用@font-face實(shí)現(xiàn)網(wǎng)頁特殊字符”這篇文章的所有內(nèi)容，感謝各位的閱讀！希望分享的內(nèi)容對(duì)大家有幫助，更多相關(guān)知識(shí)，歡迎關(guān)注億速云行業(yè)資訊頻道！