嵌入字体@font-face

@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: "MOOC Font";
src: url("http://www.imooc.com/Amaranth-BoldItalic.otf");
}
.demo {
width: 340px;
padding: 30px;
color: #566F89;
background: #000;
font-size:58px;
font-family: "MOOC Font";
}
</style>
</head>
<body>
<div class="demo">IMOOC</div>
</body>
</html>

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

  1. 【CSS3】---嵌入字体@font-face

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

  2. R - 变化plot字形,嵌入字体以pdf

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

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

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

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

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

  5. [ActionScript 3.0] 嵌入字体

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

  6. W3School-CSS 字体(font)实例

    CSS 字体(font)实例 CSS 实例 CSS 背景实例 CSS 文本实例 CSS 字体(font)实例 CSS 边框(border)实例 CSS 外边距 (margin) 实例 CSS 内边距 ...

  7. Android Studio 3.1.2 修改字体(font)大小(size) 及老版本修改主题、字体、颜色 参照地址

    Android Studio 3.1.2  修改字体(font)大小(size) 步骤:File-Settings-Editor-Color Scheme-Color Scheme Font-Size ...

  8. CSS 字体(font)实例

    CSS 字体(font)实例CSS 字体属性定义文本的字体系列.大小.加粗.风格(如斜体)和变形(如小型大写字母).CSS 字体系列在 CSS 中,有两种不同类型的字体系列名称: 通用字体系列 - 拥 ...

  9. 利用CSS的@font-face属性 在网页中嵌入字体

    字体使用是网页设计中不可或缺的一部分.网页是文字的载体,我们希望在网页中使用某一特定字体,但是该字体并非主流操作系统的内置字体,这样用户在浏览页面的时候就有可能看不到真实的设计. 美工设计师最常做的办 ...

随机推荐

  1. 【风马一族_php】PHP与Mysql建立连接

    让php发出 Hi作为基础 http://www.cnblogs.com/sows/p/5990157.html 配置apache      ../apache/conf/httpd.conf 创建p ...

  2. 建立交叉编译环境(arm-linux-gcc)

    linux系统内核版本:2.6.32-358.el6.x86_64(在64位系统上安装32位程序需要另外安装一些库) arm-linux-gcc版本:本文安装的是友善之臂tiny6410光盘中自带的a ...

  3. CentOS学习笔记--SCSI 设备热插拔

    CentOS学习笔记--SCSI 设备热插拔 处于运行中的服务器,因业务要求也许不允许重启机器,而新添加的SCSI设备(主要是硬盘)如何实现热插拔呢? 首先需要查看一下设备: #cat /proc/s ...

  4. Ubuntu14.04进入文本模式方法

    ubuntu 10.10以前的操作方法: 1 第一步,具体命令及操作如下: sudo vi /etc/init/rc-sysinit.conf env DEFAULT_RUNLEVEL=3 <- ...

  5. oracle的表名、字段名、constraint名的长度限制分别是多少?

    文章出处:http://blog.csdn.net/haiross/article/details/38379615 Oracle:表名.字段名.constraint名的长度有限制 oracle 的命 ...

  6. [转载]AppSettings和ConnectionStrings的区别

    AppSettings是ASP.NET1.1时期用的,在.NET Framework 2.0中,新增了ConnectionStrings. 1.<connectionStrings> &l ...

  7. EasyUI datagrid checkbox数据设定与取值(转自http://blog.csdn.net/baronyang/article/dnetails/9323463,感谢分享,谢谢)

    这一篇将会说明两种使用 jQuery EasyUI DataGrid 的 Checkbox 设定方式,以及在既有数据下将 checked 为 true 的该笔数据列的 Checkbox 设定为 Che ...

  8. Oracle 11gR2 RAC修改SCAN IP

    一.查看当前环境: # grid用户 检查scan-ip地址的配置 [grid@node1 ~]$ srvctl config scan SCAN name: scan-cluster.com, Ne ...

  9. 浅谈Objective-C异常处理

    -----<a href="http://www.itheima.com" target="blank">Java培训.Android培训.iOS培 ...

  10. arcgis中使用excel中x,y坐标创建点问题

    文件——从x,y中添加,可以显示点的位置 右击图层导出数据时,出现无法绘制图形,生成shapefile文件的情况.经过排除数据发现 当x,y坐标值中出现null等异常值时,会出现上述无法导出的情况.