font-face為什么有這么多地址?
url為什么有這么多? 到底怎么用啊?
SuperManSuperWorld
2016-01-25
3 回答
舉報
0/150
提交
取消
2016-03-29
一、TureTpe(.ttf)格式：
.ttf字體是Windows和Mac的最常見的字體，是一種RAW格式，因此他不為網站優化,支持這種字體的瀏覽器有【IE9+,Firefox3.5+,Chrome4+,Safari3+,Opera10+,iOS Mobile Safari4.2+】；
二、OpenType(.otf)格式：
.otf字體被認為是一種原始的字體格式，其內置在TureType的基礎上，所以也提供了更多的功能,支持這種字體的瀏覽器有 【Firefox3.5+,Chrome4.0+,Safari3.1+,Opera10.0+,iOS Mobile Safari4.2+】；
三、Web Open Font Format(.woff)格式：
.woff字體是Web字體中最佳格式，他是一個開放的TrueType/OpenType的壓縮版本，同時也支持元數據包的分離,支持這種字體的瀏覽器有【IE9+,Firefox3.5+,Chrome6+,Safari3.6+,Opera11.1+】；
四、Embedded Open Type(.eot)格式：
.eot字體是IE專用字體，可以從TrueType創建此格式字體,支持這種字體的瀏覽器有【IE4+】；
五、SVG(.svg)格式：
.svg字體是基于SVG字體渲染的一種格式,支持這種字體的瀏覽器有【Chrome4+,Safari3.1+,Opera10.0+,iOS Mobile Safari3.2+】。
CSS3 @font-face
2016-01-26
你好,url后面為什么要format ? format('embedded-opentype'), format('woff'),format('truetype'), format('svg');為什么format每次的名字都不一樣? 謝謝!
2016-01-25
為了兼容各種瀏覽器對于字體的識別。
同時支持.woff,.ttf,.otf,.svg格式的版本將被視為完全實現該屬性
@font-face?{ font-family:?'diyfont'; src:?url('diyfont.eot');?/*?IE9+?*/ src:?url('diyfont.eot?#iefix')?format('embedded-opentype'),?/*?IE6-IE8?*/ ?url('diyfont.woff')?format('woff'),?/*?chrome、firefox?*/ ?url('diyfont.ttf')?format('truetype'),?/*?chrome、firefox、opera、Safari,?Android,?iOS?4.2+*/ ?url('diyfont.svg#fontname')?format('svg');?/*?iOS?4.1-?*/ }