有时候我们做的页面需要用到一些更好看的字体 又不想用图片代替,图片会影响加载速度 则使用外部字体来显示 但是直接通过font-family又不一定全部都行 这就需要我们在css中进行定义并且引入字体文件路径 然后再使用外部字体
1.我们直接创建一个font.css
@font-face {
font-family: 'fontname';
src: url('fontname.eot');
src: local('fontname'),
url('fontname.woff') format('woff'),
url('fontname.ttf') format('truetype'),
url('fontname.svg#fontname') format('svg');
}
/*其中fontname替换为你的字体名称*/
2.在<head>里面添加:
<link rel="stylesheet" type="text/css" href="font.css">
<style type="text/css">
body {
font-family: fontname;
font-size: 14px;
line-height: 1.428571429;
color: #333333;
}
</style>
<!-- 其中fontname替换为你的字体名称 -->
ok,到这里就已经结束了!