嵌入字体@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. 
						
  2. R - 变化plot字形，嵌入字体以pdf
		
    近期使用R绘图遇到两个问题 1. 使用不同的字体 2. 保存 plot 至 pdf 当字体嵌入pdf (embed the font) 使用extrafont和Ghostscript能够解决这两个问题 ...
    
		
    3. 
						
  3. as3.0 嵌入字体的用法
		
    var txt:TextField = new TextField();//创建文本 txt.embedFonts=true;//确定嵌入字体 var font:Font=new MyFont();/ ...
    
		
    4. 
						
  4. [ActionScript 3.0]  使用Embed在类中嵌入字体
		
    package { import flash.display.Sprite; import flash.text.Font; import flash.text.TextField; import f ...
    
		
    5. 
						
  5. [ActionScript 3.0] 嵌入字体
		
    首先我们要生成一个swf的字体库,以微软雅黑为例,新建YaHei_font.fla,ctrl+L,在库面板中右键→新建字型,弹出字体元件属性窗口,选择要嵌入的字体, 并选择为ActionScript  ...
    
		
    6. 
						
  6. W3School-CSS 字体(font)实例
		
    CSS 字体(font)实例 CSS 实例 CSS 背景实例 CSS 文本实例 CSS 字体(font)实例 CSS 边框(border)实例 CSS 外边距 (margin) 实例 CSS 内边距  ...
    
		
    7. 
						
  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. 
						
  8. CSS 字体(font)实例
		
    CSS 字体(font)实例CSS 字体属性定义文本的字体系列.大小.加粗.风格(如斜体)和变形(如小型大写字母).CSS 字体系列在 CSS 中,有两种不同类型的字体系列名称: 通用字体系列 - 拥 ...
    
		
    9. 
						
  9. 利用CSS的@font-face属性 在网页中嵌入字体
		
    字体使用是网页设计中不可或缺的一部分.网页是文字的载体,我们希望在网页中使用某一特定字体,但是该字体并非主流操作系统的内置字体,这样用户在浏览页面的时候就有可能看不到真实的设计. 美工设计师最常做的办 ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. 使用buildroot编译bind DNS服务器
			
    用buildroot来制作文件系统很方便,编译出来的文件系统是直接可用的,不用添加脚本等麻烦的工作,很多的库和app都可以直接添加到文件系统里边,如常用的udhcpc,tftp,apache,ligh ...
    
			
    2. 
						
  2. 解决Access连接 accdb 不可识别的数据库格式异常
			
    在Access07之前的数据库后缀名均为*.mdb 而连接字符串写成Provider=Microsoft.Jet.OLEDB.4.0;Data Source=C:\myFolder\*.mdb ;Pe ...
    
			
    3. 
						
  3. excel上传和下载
			
    需要注意的地方: 1.js构造表单并提交 2.js中文传参encodeURI(encodeURI("中文")),action接收并转换value = URLDecoder.deco ...
    
			
    4. 
						
  4. Azkaban遇到的坑-installation Failed.Error chunking
			
    在使用azkaban做spark作业调度时,在上传zip包时报installation Failed.Error chunking错误,原来是于我们所编写的应用会上传到 MySQL 存储,过大的zip ...
    
			
    5. 
						
  5. Laravel 安装predis 扩展
			
    在安装predis扩展之前先安装composer,安装教程在https://getcomposer.org/download/: php -r "copy('https://getcompo ...
    
			
    6. 
						
  6. 如何将两个列表变成一个python字典
			
    一个列表是 index = [0, 1, 2, 3, 4, 5, 6] 另一个是 day = ['1', '2', '3', '4', '5', '6', '7' ] 可以使用dict(zip(ind ...
    
			
    7. 
						
  7. ContactsContract中涉及数据库中的一些列属性值【Written By KillerLegend】
			
    ContactsContract.Data   http://developer.android.com/reference/android/provider/ContactsContract.Dat ...
    
			
    8. 
						
  8. 数据结构学习笔记05图 (邻接矩阵 邻接表-->BFS DFS、最短路径)
			
    数据结构之图 图(Graph) 包含 一组顶点:通常用V (Vertex) 表示顶点集合 一组边:通常用E (Edge) 表示边的集合 边是顶点对:(v, w) ∈E ,其中v, w ∈ V 有向边& ...
    
			
    9. 
						
  9. AngularJs记录学习01
			
    <!doctype html> <html ng-app="myapp"> <head> <meta http-equiv="C ...
    
			
    10. 
						
  10. HelloWorld IL代码
			
    .assembly extern mscorlib .assembly HelloWorld.class HelloWorld extends [mscorlib] System.Object {   ...
    
			
    11.