@font-face能够加载服务器端的字体文件，让浏览器端可以显示用户电脑里没有安装的字体。

语法：

@font-face {

    font-family : 字体名称;

    src : 字体文件在服务器上的相对或绝对路径;

}

这样设置之后，就可以像使用普通字体一样在（font-*）中设置字体样式。

比如：

p {

    font-size :12px;

    font-family : "My Font";

    /*必须项，设置@font-face中font-family同样的值*/

}

例子：

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>嵌入字体</title>

<style type="text/css">

@font-face{

    font-family: "myFont";

    src: url("http://www.imooc.com/Amaranth-BoldItalic.otf");

}

.demo {

    width: 340px;

    padding: 30px;

    color: #566F89;

    background: #000;

    font-size:58px;

    font-family: "myFont";

}

</style>

</head>

<body>

<div class="demo">myFont</div>

</body>

</html>

效果：加了字体的：

【CSS3】---嵌入字体@font-face的更多相关文章

  1. 【CSS3】字体font

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  2. CSS3嵌入字体

    @font-face能够加载服务器端的字体文件,让浏览器端可以显示用户电脑里没有安装的字体.语法: 例子:

  3. 嵌入字体@font-face

    嵌入字体@font-face @font-face能够加载服务器端的字体文件,让浏览器端可以显示用户电脑里没有安装的字体. 语法: @font-face { font-family : 字体名称; s ...

  4. css3 web字体记

    css3 web字体 @font-face语法 @font-face能够加载服务器端的字体,让客户端浏览器显示客户端没有安装的字体. @font-face{ font-family:<YourW ...

  5. R - 变化plot字形，嵌入字体以pdf

    近期使用R绘图遇到两个问题 1. 使用不同的字体 2. 保存 plot 至 pdf 当字体嵌入pdf (embed the font) 使用extrafont和Ghostscript能够解决这两个问题 ...

  6. css3文本字体

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. as3.0 嵌入字体的用法

    var txt:TextField = new TextField();//创建文本 txt.embedFonts=true;//确定嵌入字体 var font:Font=new MyFont();/ ...

  8. [ActionScript 3.0] 使用Embed在类中嵌入字体

    package { import flash.display.Sprite; import flash.text.Font; import flash.text.TextField; import f ...

  9. [ActionScript 3.0] 嵌入字体

    首先我们要生成一个swf的字体库,以微软雅黑为例,新建YaHei_font.fla,ctrl+L,在库面板中右键→新建字型,弹出字体元件属性窗口,选择要嵌入的字体, 并选择为ActionScript ...

随机推荐

  1. Spring使用Cache、整合Ehcache

    http://haohaoxuexi.iteye.com/blog/2123030 Spring使用Cache 从3.1开始,Spring引入了对Cache的支持.其使用方法和原理都类似于Spring ...

  2. Nginx (基于linux)综合

    重启Nginx服务:centos:测试NGINX配置文件是否有效:/usr/local/nginx/sbin/nginx -t 平滑重启:/usr/local/nginx/sbin/nginx -s  ...

  3. jquery 预览提交的表单

    预览表单,查看后确认提交或者返回重填 演示 XML/HTML Code <form class="mform" id="myform" method=&q ...

  4. UVALive 4222 Dance 模拟题

    Dance 题目连接: https://icpcarchive.ecs.baylor.edu/index.php?option=com_onlinejudge&Itemid=8&pag ...

  5. Android语音搜索

    前言 在现有的软件的搜索框中基本上都会加上语音搜索的图标,以方便用户输入.我们xxxx的搜索框其实也可以借鉴这样的输入方式,提高用户体验.语音识别有3种方式实现①使用intent调用语音识别程序;②通 ...

  6. 项目优化经验分享（八）TeamLeader经验总结

    引言 通过前面的七篇博客.我把自己在项目优化过程的经验进行了分享,今天这篇博客,作为一个总结,就来讲讲作为一个TeamLeader,在项目管理中遇到的问题和解决经验! 正文 问题一:团队之间怎么沟通? ...

  7. NPOI 教程 - 3.2 打印相关设置

    转:http://www.cnblogs.com/wolfplan/archive/2013/01/13/2858991.html NPOI 教程 - 3.2 打印相关设置   打印设置主要包括方向设 ...

  8. javascript异步延时载入及推断是否已载入js/css文件

    <html> <head> <script type="text/javascript"> /**======================= ...

  9. 分布式存储系统sheepdog

    Sheepdog,是由NTT的3名日本研究员开发的开源项目,主要用来为虚拟机提供块设备. 其架构例如以下: 以下,我们将从架构.模块等几个方面来介绍下: 一.架构图 如上图: 採用无中心节点的全对称架 ...

  10. 【iOS开发必备指南合集】申请企业级IDP、真机调试、游戏接入GameCenter 指南（实现仿官方的成就提示）、游戏接入OpenFeint指南；

    本站文章均为李华明Himi原创,转载务必在明显处注明:(作者新浪微博:@李华明Himi) 转载自[黑米GameDev街区] 原文链接: http://www.himigame.com/iphone-c ...