嵌入字体@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. Semantic UI 使用回调函数
			
    html代码: <div class="ui dropdown item" id="region"> <div class="tex ...
    
			
    2. 
						
  2. [视频]ARM告诉你物联网怎么玩,mbed 6LoWPan demo
			
    该视频演示了基于arm mbed的物联网设备间的6LoWPAN应用,如连接家里的土壤湿度传感器,灯光控制,安防联动等应用. 演示视频       原创文章,转载请注明: 转载自 http://www. ...
    
			
    3. 
						
  3. The given path's format is not supported.
			
    问题 编程以来今本没有使用input[type=file]这个控件过,今天突然使用尽然报错了,在本地chrome,firefox等其他的浏览器都是好的,唯独ie报错了.在服务器的时候,尽然chrome ...
    
			
    4. 
						
  4. 【PHP】金额数字转换成大写形式
			
    <?php /*将数字金额转成大写*/ function num_to_upper($num) { $d = array('零','壹','贰','叁','肆','伍','陆','柒','捌', ...
    
			
    5. 
						
  5. jquery 获取元素坐标
			
    不错哦! 原文地址:http://jianzhong5137.blog.163.com/blog/static/9829049201182295833503/ 绝对X,Y坐标,可以用offset()方 ...
    
			
    6. 
						
  6. 通过URLHttpConnection方式连接网络步骤，获取位图为例
			
    要注意的是:访问网络不能直接放在主线程,要放在另外一个线程里面,如果放在主线程会报android.os.NetworkOnMainThreadException错误1 public Bitmap ge ...
    
			
    7. 
						
  7. C#的编译
			
    Windows上的编译 1:先将C:\Windows\Microsoft.NET\Framework\v3.5配置到系统环境变量的path里. 2:写C#代码 demo1.txt using Syst ...
    
			
    8. 
						
  8. python自学笔记一
			
    之前看过一段时间的小甲鱼零基础自学python,b站上有高清免费资源[av4050443],但是作为零基础实在学得艰难,下载了python核心编程pdf,在这里做一些笔记. 虽然使用的是第二版的教材, ...
    
			
    9. 
						
  9. sublimeLinter-jshint 配置
			
    这几天知道sublime3有可以对javascript进行语法检查的文件,折腾了一上午,搞定了. 记录一下步骤: 1.先安装nodejs. 2.npm install jshint -g 3.通过su ...
    
			
    10. 
						
  10. AsyncTask和Handler两种异步方式的实现和区别比较
			
    1  AsyncTask实现的原理,和适用的优缺点 AsyncTask,是android提供的轻量级的异步类,可以直接继承AsyncTask,在类中实现异步操作,并提供接口反馈当前异步执行的程度(可以 ...
    
			
    11.