在网页中引入特殊字体

网页使用的字体需要受制于操作系统,如果用户的操作系统没有安装某个字体,网页则会退而求其次的使用系统自带的字体。

因此我们并不能随便使用一些好看的字体,只能选用一些安全字体。比如:Helvetica,Arial,宋体,微软雅黑。

如何在网页中加载特殊字体

1、在百度搜索想要加载的字体库,下载下来转换成.ttf格式。(一般直接下载下来的字体都是 .ttf 格式)

2、在网页源码中引入字体代码如下:

<style>
@font-face
{
font-family: my;
src: url('./fonts/long.ttf'); /* IE9+ */
}
.abc
{
font-family:my;
width:100px;
height:100px;
background:yellow;
transition:width 2s;
-moz-transition:width 2s; /* Firefox 4 */
-webkit-transition:width 2s; /* Safari and Chrome */
-o-transition:width 2s; /* Opera */
}
.abc:hover
{
width:300px;
}
</style>
<div class="abc">
有些文字不支持!
</div>

3、显示的效果

字体加载

推荐阅读

  1. Google Search Console移动设备易用性报错修复【已解决】
  2. 熊掌号中天级收录和周级收录的区别?
  3. 如何在没有插件的情况下为WordPress中的外部链接添加nofollow
  4. 在wordpress通过代码实现百度主动推送|手工提交|实时推送
  5. wordpress熊掌号站点天级收录链接提交代码【不用插件实现】
  6. 百度官方推出一款WordPress链接提交插件【baidu links submit】
  7. 什么是别名域(Aliasdomain)?
  8. 什么是子域(Subdomain)?

发表评论

电子邮件地址不会被公开。 必填项已用*标注