src: url('/Common/fonts/FZLTTHBJW.TTF'); } @font-face { font-family: 'network'; /* 此处仅为网络地址的示例 ,请勿将字体文件使用在产品中*/ src: url('https://lfmemberdev.hwcloudtest.cn:9094/fastapp/download/FZCCHJW.TTF'); } @font-face { font-family: 'system' src:local('系统字体名...
@font-face { font-family: 'MyWebFont'; src: url('webfont.eot'); /* IE9 Compat Modes */ src: url('webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('webfont.woff') format('woff'), /* Modern Browsers */ url('webfont.ttf') format('truetype'), /* S...
为了使@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:'iconlove';src:url(data:font/truetype;charset=utf-8;base64,AAEAAAANAIAAAwBQ...format('truetype');font-weight:normal;font-style:normal;} 上面代码就是下载下来的 .iconlove{font-family:"iconlove"!important;font-size:16px;font-style:normal;color:#B2B2B4;} 在这个基础...
/*引入外部字体文件*/@font-face{font-family:myFirstFont;/*eot格式兼容IE*/src:url(fonts/AdineKirnber.eot);/*ttf格式兼容非IE*/src:url(fonts/AdineKirnber.ttf); }h1{font-family:myFirstFont,verdana,sans-serif;font-size:4em; } 运行效果如下: ...
src: local(font name), url("font_name.ttf") 1. 三、字体格式 对于@font-face而言,兼容性问题就是各浏览器所能识别的字体格式不尽相同。 TrueType格式(.ttf) Windows和Mac上常见的字体格式,是一种原始格式,因此它并没有为网页进行优化处理。
/*第一步:定义自定义字体*/@font-face{/*大括号:设置引入规自定义字体的规则*//*该font-family是规则符,不是属性。用于描述自定义字体的名称*/font-family:'自定义字体名称';src:url(‘自定义字体文件’)(相对路径、绝对路径)}/*第二步:向元素应用自定义字体*/ ...
@font-face{[font-family:<family-name>;]||[src:[<url>[format(<string>#)]?|<font-face-name>]#;]||[unicode-range:<urange>#;]||[font-variant:<font-variant>;]||[font-feature-settings:normal|<feature-tag-value>#;]||[font-stretch:<font-stretch>;]||[font-weight:<weight>;]||[fo...
[<url>format(<string>#)?|local(<family-name>)]#where<family-name>=<string>|<custom-ident>+ 实例 代码语言:javascript 复制 @font-face{font-family:examplefont;src:local(Example Font),url('examplefont.woff')format("woff"),url('examplefont.otf')format("opentype");} ...
一、创建@font-face注释 @font-face注释是一种用于将字体嵌入到HTML文档中的标记。它主要用于将字体嵌入到HTML文档中的字符元素中。 要创建一个@font-face注释,需要使用CSS和@font-face规则。下面是一个示例: <!DOCTYPE html> <html> <head> <style> @font-face { font-family: MyFont; src: url('MyFont...