嵌入字体@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. JAVA设计模式--State(状态模式)
			
    状态模式(State Pattern)是设计模式的一种,属于行为模式. 定义(源于Design Pattern):当一个对象的内在状态改变时允许改变其行为,这个对象看起来像是改变了其类. 状态模式主要 ...
    
			
    2. 
						
  2. GET POST 区别详解
			
    Get是用来从服务器上获得数据,而Post是用来向服务器上传递数据. 2. Get将表单中数据的按照variable=value的形式,添加到action所指向的URL后面,并且两者使用“?”连接,而 ...
    
			
    3. 
						
  3. C++ 三种工厂模式
			
    工厂模式是将带有继承于基类的子类的创建过程交于一个工厂来创建,通过赋予不同的创建标识来创建不同的子类. 基于自己的理解和使用这里巩固一下工厂模式. 我们的项目目前使用最多的是简单工厂模式,不过其他两种 ...
    
			
    4. 
						
  4. POJ C程序设计进阶  编程题＃4：Tomorrow never knows？
			
    来源: POJ (Coursera声明:在POJ上完成的习题将不会计入Coursera的最后成绩.) 注意: 总时间限制: 1000ms 内存限制: 65536kB 描述 甲壳虫的<A day  ...
    
			
    5. 
						
  5. 软件工程 speedsnail 冲刺6
			
    2015-5-10 完成任务:学习了黑马android教学视频13.14.15集,记分功能: 遇到问题: 问题1 android native method not found 解决1 没有解决 明日 ...
    
			
    6. 
						
  6. 如何在linux中配置PHP环境
			
    yum -y install httpd php mysql mysql-server php-mysql//安装mysql扩展yum -y install mysql-connector-odbc( ...
    
			
    7. 
						
  7. zabbix基本功能操作
			
    上一篇我已经把zabbix server 和zabbix agent 安装在了同一台主机上,现在如何配置zabbix server监控自己. vim /etc/zabbix/zabbix_agentd ...
    
			
    8. 
						
  8. 个性化修改Linux登录时的字符界面
			
    如果采用root账号登录编辑/etc/bashrc内容,那所有其他帐号登录都会提示相同的内容,如果想每个用户进行配置,那就去每个帐号的目录下去配置吧. 这里提供改一个文件所有帐号都能看到的个性显示内容 ...
    
			
    9. 
						
  9. Android sqlite3工具的使用
			
    sqlite3 <数据库名称> 进入数据库操作模式 eg: sqlite3 contacts.db .tables 查看所有的表 eg: .table .schema 查看查看库中所有表的 ...
    
			
    10. 
						
  10. android 特效UI实现
			
    弧形菜单 https://github.com/daCapricorn/ArcMenu
    
			
    11.