如何引进外部字体文件。

有时候UI为了界面好看,内容丰富,常常会使用一些特殊字体来修饰页面。那我们前端还原时一般就有两个做法,一是把它当做图片处理,二是引入外部字体文件。第一种做法不易于前端人员修改,还有一个就是涉及到版权问题,这是我网上随便找的文章《你造吗?微软雅黑字体使用也是有版权的》,今天就来说说如何引进外部字体文件。
html

<p class="one">今天不用上学啦</p>
<p class="two">今天不用上学啦</p>
<p class="three">今天不用上学啦</p>

css

@font-face {
        font-family:'aa';
    src:url('font/amjt.ttf');
}
@font-face {
    font-family:'bb';
    src:url('font/mct.ttf');
}
@font-face {
    font-family:'cc';
    src:url('font/TTENuoJ_0.ttf');
}
.one{font-size: 30px;color: #ccc;font-family: 'aa';}
.two{font-size: 30px;color: #ccc;font-family: 'bb';}
.three{font-size: 30px;color: #ccc;font-family: 'cc';}

文件目录
1201661-20171019233733318-1205687385.png
效果图
1201661-20171019234728974-416624715.png
但是引入外部字体文件有个缺点就是字体文件过大。先要减少字体文件的大小可以看《如何给引入的文字文件瘦身》

转载于:https://www.cnblogs.com/heixingxing/p/7679524.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值