在css中，可利用“@font-face”规则来加载外部字体文件，语法@font-face {font-family:字体名称;src:url(外部字体文件路径);[font-weight:粗细值];[font-style:样式值];}”。
本教程操作环境：windows7系统、CSS3&&HTML5版、Dell G3电脑。
在css中，可利用“@font-face”规则来加载外部字体文。
@font-face是CSS3中的一个模块，它主要是把用户自定义的Web字体嵌入到你的网页中。
通过使用 @font-face 规则，Web 设计师不必再使用任何一种“网络安全”字体。
立即学习“前端免费学习笔记（深入）”；
在 @font-face 规则中，您必须首先定义字体名称（例如 myFirstFont），然后指向字体文件。
@font-face的语法规则：
@font-face { font-family: 字体名称; src: [][, []]*; [font-weight: ]; [font-style: ]; }
登录后复制
font-family: 字体名称 ：自定义字库名称（一般设置为所引入的字库名），后续样式规则中则通过该名称来引用该字库。
src ：设置字体的加载路径和格式，通过逗号分隔多个加载路径和格式
srouce ：字体的加载路径，可以是绝对或相对URL。
format ：字体的格式，主要用于浏览器识别，一般有以下几种——truetype,opentype,truetype-aat,embedded-opentype,avg等。
css使用外部字体文件的方法
1、首先要下载好字体，并且放在了font目录下
2、使用@font-face 规则引入字体并给名字取一个合适的名字
@font-face { font-family: 'fontnameRegular'; src: url('fontname.eot'); src: local('fontname Regular'), local('fontname'), url('fontname.woff') format('woff'), url('fontname.ttf') format('truetype'), url('fontname.svg#fontname') format('svg');}
登录后复制
3、使用刚刚定义的字体
h1{font-family: fontnameRegular}
登录后复制
（学习视频分享：css视频教程）
以上就是css怎么加载外部字体文件的详细内容，更多请关注【创想鸟】其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至253000106@qq.com举报，一经查实，本站将立刻删除。
发布者：PHP中文网，转转请注明出处：https://www.chuangxiangniao.com/p/2870867.html
