現在字體圖標已經漸漸代替了圖片了,移動端用起來也很方便。
使用了字體文件來顯示矢量的圖標,為了能在IIS上正常顯示圖標,可以通過增加iis的MIME-TYPE來支持圖標字體文件
下面就把IIS增加svg、eot 、woff、otf 、ttf 等字體格式文件的MIME。
增加以下兩種文件類型即可:
.svg image/svg+xml
.woff application/font-woff
我把其它幾種也寫在下面,供以后學習:
.eot application/vnd.ms-fontobject
.otf application/octet-stream
.ttf application/octet-stream
(完)
今天測試的一個代碼,在本地一切正常,可是上傳到服務器上之后就發現一些圖標不顯示了。圖片存在,但是也訪問不了,就百度了下,這個.svg的圖片想要在iis上能正常打開,還需要做一下映射才行。
1、先打開IIS-找到你網站點右鍵屬性-HTTP頭-點擊MIME類型
2、單擊新建,按照如下內容輸入
擴展名:.svg
MIME類型:image/svg+xml
全部添加完成后點擊確定 保存退出 刷新網頁看看顯示是否正常,如果還不行就檢測你是否哪里少了標點符號.
同樣IIS6也是可以支持WOFF/WOFF2的,正確的MIME信息應該是這么寫:
擴展名:.woff
MIME類型:application/x-font-woff
擴展名:.woff2
MIME類型:application/x-font-woff
添加后重啟該站點即可看見效果. IIS7下面的部署方法請參考 IIS7環境下實現svg/woff/woff2字體正常顯示
最近公司的幾個WordPress網站從AWS搬家到Windows環境下,又折騰了好一陣子。今天新鮮出爐一個新的問題,發現網站上的woff字體又報404了。在確認文件已經上傳到正確路徑下后,再回想一下之前碰到的IIS環境下找不到字體文件的問題,感覺應該又是沒有給字體文件添加MIME類型的原因。Windows Azure并非虛擬主機,所以也不會給我一個IIS讓我配置,只能想其他辦法。
所幸的是在網站的根目錄找到了一個web.config文件,印象中這應該是ASP.NET的應用程序的配置文件。雖然WordPress用的是PHP語言,但對于文件類型的管理,應該不牽涉到網站用什么語言的范疇,只要正確配置服務器環境即可。
打開web.config,這是一個XML文件,里面已經帶一條svg文件的MIME類型信息,和之前在IIS里面配置的內容很像:
<mimeMap fileExtension=".svg" mimeType="image/svg+xml"/>
之前IIS里面對于幾個字體文件的MIME類型設置如下:
依樣畫葫蘆的在web.config里面追加這兩條:
<mimeMap fileExtension=".woff" mimeType="application/x-font-woff" />
<mimeMap fileExtension=".woff2" mimeType="application/x-font-woff" />
整個文件里面關于MIME類型的標簽結構應該是這樣的:
<?xml version="1.0" encoding="UTF-8"?>
<configuration>
<system.webServer>
<staticContent>
<mimeMap fileExtension=".svg" mimeType="image/svg+xml"/>
|
新聞熱點
疑難解答
圖片精選