inconfont 字體庫應用

先去註冊個號碼，好像只能夠用新浪微博登陸哈，搞一個微博去。

第一就是點上面圖標庫，選擇官方和全部都行。

恩接着點一個圖標，他就本身跑到 第二個按鈕哪裏去了，在點第二個按鈕，會出來一個建立項目，隨便建立一個就好。

上圖不說話

下載本地這個 你們都會把我就不解釋了哈，別問我 怎麼不和照片同樣，我以前就給那個項目裏面加了好幾個圖標，你的只有一個圖標是正確的。

恩而後就獲得了這麼多文件，然而咱們只要我紅色框裏面圈到的文件就好

 

 

如今咱們把 咱們要獲得的東西都獲得了，而後就是 你本身寫html了：

第一步：使用font-face聲明字體

@font-face {
　　font-family: 'iconfont';
　　src: url('iconfont.eot'); /* IE9*/
　　src: url('iconfont.eot') format('embedded-opentype'), /* IE6-IE8 */
　　url('iconfont.woff') format('woff'), /* chrome、firefox */
　　url('iconfont.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
　　url('iconfont.svg') format('svg'); /* iOS 4.1- */
}

第二步：定義使用iconfont的樣式

.iconfont{
    font-family:"iconfont" !important;
    font-size:16px;font-style:normal;
    -webkit-font-smoothing: antialiased;
    -webkit-text-stroke-width: 0.2px;
    -moz-osx-font-smoothing: grayscale;
}

第三步：挑選相應圖標並獲取字體編碼，應用於頁面

<i class="iconfont">&#x33;</i>

第一步那些代碼所有複製粘貼到你的css文件，嗯嗯，上面說到 要的那四個文件 你找一個地方存着，看後綴eot和woff和ttf和svg後綴的，對於上面的吧路徑弄對，弄就是搞的意思。而後把第二部所有也複製在css裏面，那個 .inconfont 那個class名字，你給你的i標籤class用什麼名字第二部就用什麼名字。固然在第二部那個inconfont裏面也能夠加color顏色啊，font-size改變大小啊 均可以的哈。第三部i標籤裏面放的那個代碼就是第四張圖 下面的那個代碼，那個代碼就能出來圖標 恩 OK了，完美不，快大聲喊完美