@font-face是CSS3中的一个模块,他主要是把自己定义的Web字体嵌入到你的网页中,随着@font-face模块的出现,我们在Web的开发中使用字体不只能使用Web安全字体 首先我们一起来看看@font-face的语法规则: @font-face { font-family: <YourWebFontName>; src: <source> [<format>][,<source> [<format>]]*; [...
为解决兼容性问题,Paul Irish写了称为Bulletproof的一个独特的@font-face语法: @font-face { font-family: ‘YourWebFontName’; src: url(‘YourWebFontName.eot’); /* IE9 Compat Modes */ src: url(‘YourWebFontName.eot?#iefix’) format(‘embedded-opentype’), /* IE6-IE8 */ url(‘YourW...
为了使@font-face达到更多的浏览器支持,Paul Irish写了一个独特的@font-face语法叫Bulletproof @font-face: @font-face { font-family: 'YourWebFontName'; src: url('YourWebFontName.eot?') format('eot');/*IE*/ src:url('YourWebFontName.woff') format('woff'), url('YourWebFontName.ttf') f...
@font-face { font-family: '徐静蕾手写体'; src: url('http://www.webhek.com/徐静蕾手写体.eot'); /* IE9 Compat Modes */ src: url('http://www.webhek.com/徐静蕾手写体.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('http://www.webhek.com/徐静蕾手写体.wof...
@font-face { font-family:<YourWebFontName>; src:<source>[<format>][,<source>[<format>]]*; [font-weight:<weight>]; [font-style:<style>]; } 取值说明: 1、YourWebFontName:自定义字库名称(一般设置为所引入的字库名),后续样式规则中则通过该名称来引用该字库。最好是使用你下载的默认字体,他...
url('font1.ttf') format('truetype'); } 在这个示例中,使用了三个src描述符来指定字体文件的来源。首先尝试加载font1.woff2文件,如果不支持woff2格式,则尝试加载font1.woff文件,最后如果都不支持,则加载font1.ttf文件。 CSS font-face - when使用多个src描述符的优势是可以提供更好的兼容性和容错性。通过提...
一、 font-face基本用法 font-face的基本用法想必大家都是知道的,基本上就是类似这样: @font-face{font-family:Lato;src:url('font-lato/lato-regular-webfont.woff2')format('woff2'),url('font-lato/lato-regular-webfont.woff')format('woff'),url(font-lato/lato-regular-webfont.ttf)format("opentype...
在使用@font-face注释加载特殊字体后,需要为其设置相应的字体样式。下面是一个示例: <!DOCTYPE html> <html> <head> <style> @font-face { font-family: MyFont; src: url('MyFont.eot'); src: url('MyFont.eot?#iefix') format('embedded-opentype'), url('MyFont.woff') format('woff'), url...
1、@font-face 与 EOT 格式 之所以把它们放到一起是因为首个实现 @font-face 和 EOT 的是同一家公司 - 微软。早在九十年代CSS就有了自定义字体的语法,IE4是首个实现此语法的浏览器,没错,就是IE。不过,字体格式只能是微软自己开发的 EOT(Embedded Open Type) 格式。EOT 允许字体的作者保护字体不被非法复制...
首先我们一起来看看@font-face的语法规则: @font-face { font-family: <YourWebFontName>; src: <source> [<format>][,<source> [<format>]]*; [font-weight: <weight>]; [font-style: <style>]; } 取值说明 YourWebFontName:此值指的就是你自定义的字体名称,最好是使用你下载的默认字体,他将被...