CSS的font-family属性使网页可以使用客户电脑里的字体,从而得到多姿多彩的WEB页面,但当客户端没有你想要使用的字体时怎么办呢?我们总不能让每个访问者都去安装一个字体吧?事实上,这是可以的!不过不是访客主动下载的,而是网站开发者帮访客下载安装的,具体怎么实现的,我们还要从字体文件的格式说起。

字体格式类型主要有几个大分类:TrueType、Embedded Open Type 、OpenType、WOFF 、SVG。  
TrueType
 Windows和Mac系统最常用的字体格式,其最大的特点就是它是由一种数学模式来进行定义的基于轮廓技术的字体,这使得它们比基于矢量的字体更容易处理,保证了屏幕与打印输出的一致性。同时,这类字体和矢量字体一样可以随意缩放、旋转而不必担心会出现锯齿。  
EOT – Embedded Open Type (.eot)
 EOT是嵌入式字体,是微软开发的技术。允许OpenType字体用@font-face嵌入到网页并下载至浏览器渲染,存储在临时安装文件夹下。  
OpenType (.otf)
 OpenType是微软和Adobe共同开发的字体,微软的IE浏览器全部采用这种字体。致力于替代TrueType字体。  
WOFF – Web Open Font Format (.woff)

WOFF(Web开发字体格式)是一种专门为了Web而设计的字体格式标准,实际上是对于TrueType/OpenType等字体格式的封装,每个字体文件中含有字体以及针对字体的元数据(Metadata),字体文件被压缩,以便于网络传输。

SVG (Scalable Vector Graphics) Fonts (.svg)
 SVG是由W3C制定的开放标准的图形格式。SVG字体就是使用SVG技术来呈现字体,还有一种gzip压缩格式的SVG字体。
 
 在CSS3中,添加了一个@face-face属性,通过这个属性我们就可以加载服务器上的字体文件,放在客户机的临时安装文件夹下,
 
 用法如下:

@font-face {font-family: "FontAwesome";font-style: normal;font-weight: normal;src: url("fontawesome-webfont.eot?#iefix") format("eot"), url("fontawesome-webfont.woff") format("woff"), url("fontawesome-webfont.ttf") format("truetype"), url("fontawesome-webfont.svg#FontAwesome") format("svg");
}

转载于:https://www.cnblogs.com/chinahuzi/p/3733175.html

CSS3新属性:在网站中使用访客电脑里没有安装的字体相关推荐

  1. 两点补充——CSS3新属性以及弹性布局

    CSS3 新属性 一.[ CSS3新增属性前缀 ] 1.-webkit-:chrome/safari 2.-moz-:火狐 3.-mo-:IE 4.-o-: Opera 欧朋 二 .[CSS 长度单位 ...

  2. 从零开始学前端:css3新属性scss和less --- 今天你学习了吗?(CSS:Day22)

    从零开始学前端:程序猿小白也可以完全掌握!-今天你学习了吗?(CSS) 复习:从零开始学前端:形变 - 今天你学习了吗?(CSS:Day21) 文章目录 从零开始学前端:程序猿小白也可以完全掌握!-今 ...

  3. 前端基础8:HTML5新增标签及CSS3新属性 viewport 动画

    HTML5新增标签 标签名 描述 header 头部 section 区分大模块 nav 导航 footer 尾部 article 文章 aside 侧边栏 audio 音频 video 视频 fig ...

  4. windows10访客_如何在Windows 10中创建访客帐户

    windows10访客 If you find that your guests are asking fairly often to use your computer temporarily to ...

  5. 统计代码放在网站php,网站添加简单访客统计代码

    都知道,网站的来访量的多少只有网站主自己知道,是因为在后台安装统计工具,访客想要知道某个网站有多少来访量怎么办呢?其实还可以通过添加代码在网站的前端显示哦,那么今天明星就来说说网站如何添加访客统计代码 ...

  6. 网站如何添加访客统计代码

    都知道,网站的来访量的多少只有网站主自己知道,是因为在后台安装统计工具,访客想要知道某个网站有多少来访量怎么办呢?其实还可以通过添加代码在网站的前端显示哦,那么今天明星就来说说网站如何添加访客统计代码 ...

  7. django+vue+nginx+frp搭建漫画网站之获取访客真实ip(二)

    地址:http://www.iewoai.com/ 1.背景 最近听室友说,他网站有监控访客的ip,并通过钉钉通知的服务.于是我在想,我为什么不给漫画网站加这个服务呢,说整就整,首先得获取到真实ip. ...

  8. 百度统计:网站统计实时访客报告

    百度统计:网站统计实时访客报告 后台查看 · 截图: 文档地址 · 截图: 官方文档:https://tongji.baidu.com/web/welcome/login 设置教程 · 步骤 · 使用 ...

  9. 网站底部添加访客阅读次数总访问量在线人数代码

    简介: 网站底部添加访客阅读次数总访问量在线人数代码分享 请在此输入内容代码放置在 主题目录下:footer.php(放在合适的位置) 也可以调用自己的JS 下载JS后 上传到服务器 修改上方代码引用 ...

最新文章

  1. numpy使用[]语法索引二维numpy数组中指定指定行之前所有数据行的数值内容(accessing rows in numpy array before specifc row)
  2. UVA - 11181 数学
  3. Linux查看:crontab开启状态
  4. zentao怎么卸载linux,linux下搭建ZenTaoPMS项目管理软件
  5. 智能玩具 数据采集 首页展示 注册 登录 自动登录 二维码图片
  6. MySQL5.6多实例安装
  7. 洛谷P1061 Jam的计数法 数学
  8. 按键精灵通过句柄获取窗口坐标_按键精灵 句柄 获得句柄 控制windows窗口 后台...
  9. vasp 计算杨氏弹性_高阶弹性常数计算的一点建议
  10. 计算机技巧:Vmware虚拟机恢复物理机GHOST备份
  11. idea git Untracked Files Prevent Pull
  12. MATLAB寻找水仙花数字
  13. (附源码)计算机毕业设计SSM旅游推广系统
  14. 小说作者推荐:不问三九合集
  15. 用spark分析北京积分落户数据,按用户身份证所在省份城市分析
  16. 计算机cpu的速度越来越快 这导致,计算机一级笔试模拟题(1-6)
  17. 引入CSS样式表的三种方式
  18. jQuery05(插件)
  19. 修改matlab fig,matlab只修改fig图形属性不修改源码的方法
  20. 2021年5月5日大学化学无机原理(11)—氧化还原反应,原电池,电极电势,能斯特方程。

热门文章

  1. CPU 缓存一致性协议 MESI
  2. 10个MySQL加载数据内文件示例以将文本文件数据上传到表
  3. kernel笔记——库文件与系统调用
  4. Python,Day2 - 数据类型,运算,列表操作,字典
  5. 剑指Offer(java版):字符串的排列
  6. 分享一款好看的城市选择器
  7. CentOS6.2下安装中文输入法
  8. 电脑账户与用户账户编码规则
  9. socket编程(八)
  10. 安卓系统校园招聘平台APP答辩PPT免费下载