獲取網頁iconfont的方法，查看eot文件內容

一、爬取網站iconfont文件

右鍵網頁查看源代碼 >> ctrl+F搜索"css" 

 

點開連接會打開css文件>> ctrl+F搜索"font-face"

找到font-face相對路徑的url之后，推測font-face的絕對路徑為：css的父路徑 + font-face的url

在瀏覽器輸入https://s01.mifile.cn/i/font/iconfont.eot按回車就彈出了下載界面。

由於eot很多瀏覽器不支持，所以想下載ttf格式的文件，推測文件名為iconfont.ttf，所以在瀏覽器輸入https://s01.mifile.cn/i/font/iconfont.ttf按回車，竟然真的下載到了！

 

二、查看iconfont內容

下載軟件FontLab VI.exe，將下載好的eot / ttf文件拖動到軟件面板中，會顯示如下圖：

可以看到iconfont的十六進制的unicode。

 

 

三、iconfont的使用方法

ccs文件：

@font-face {
    font-family: 'fontNameRegular';
    src:url('iconfont.ttf');
}

.icon-font{
    font-family: fontNameRegular;
}

html文件：

<span class="icon-font">&#xe608;</span>

&為字符實體（character entities）

&#表示十進制，&#x表示十六進制。

顯示結果：

 

參考文章：

獲取和使用某些網站的iconfont圖標字體

CSS3 icon font完全指南

&#x開頭的是什么編碼?