@font-face { 效果展示 各种格式说明 一、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+】; 由于woff字体为最佳格式,如果其他字体不能用,可以把他们转化成woff字体 字体转化网址:https://www.fontke.com/tool/convfont/ 为了适用各种浏览器不同字体的书写形式 @font-face {
font-family:
src:
[font-weight:
[font-style:
小朋友加油哦,你是最棒的
font-family: 'YourWebFontName';
src: url('YourWebFontName.eot'); /* IE9 Compat Modes */
src: url('YourWebFontName.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('YourWebFontName.woff') format('woff'), /* Modern Browsers */
url('YourWebFontName.ttf') format('truetype'), /* Safari, Android, iOS */
}
手机扫一扫
移动阅读更方便
你可能感兴趣的文章