css3-11 网页如何使用自定义字体
css3-11 网页如何使用自定义字体
一、总结
一句话总结：下载好字体文件，然后在网页中引入，用src: url('my.otf');来引入，使用的时候就使用自己定义的名字来使用这个字体。
1、网页如何使用自定义字体？
下载好字体文件，然后在网页中引入，用src: url('my.otf');来引入，使用的时候就使用自己定义的名字来使用这个字体。
声明
7 @font-face
8 {
9 font-family: my;
10 src: url('my.otf');
11 }
使用
13 *{
14 font-family: my;
15 }
2、声明网页使用字体文件在哪里声明，声明的关键词是什么？
在style里面
@font-face
3、声明字体为了解决什么问题？
网页中的字体用户电脑没有，服务器上也没有的问题
现在只要网站有就可以啦
4、如何使用声明的字体？
声明字体的时候会指定名字，用的时候直接使用这个名字就可以了
7 @font-face
8 {
9 font-family: my;
10 src: url('my.otf');
11 }
12
13 *{
14 font-family: my;
15 }
二、网页如何使用自定义字体
1、相关知识
@font-face
{
font-family: fzm;
src: url('fzm.ttf');
}
2、代码
自定义字体类型
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>index</title>
<style>
@font-face
{
font-family: my;
src: url('my.otf');
} *{
font-family: my;
} div{
width:500px;
height:300px;
} </style>
</head>
<body>
<div>
<p>我是小金，我爱睡觉!</p>
<p>linux is very much!</p>
<p>linux is very much!</p>
<p>linux is very much!</p>
<p>linux is very much!</p>
</div>
</body>
</html>
css3-11 网页如何使用自定义字体的更多相关文章
- css3 自定义字体的使用方法
@font-face是CSS3中的一个模块,他主要是把自己定义的Web字体嵌入到你的网页中,随着@font-face模块的出现,我们在Web的开发中使用字体不怕只能使用Web安全字体,你们当中或许有许 ...
- CSS3的自定义字体@font-face:将图片ICON转为字体
大家都知道现在各个浏览器都支持CSS3的自定义字体(@font-face),包括IE6都支持,只是各自对字体文件格式的支持不太一样.那么对于网站中用到的各种icon,我们就可以尝试使用font来实现, ...
- css3 自定义字体_使用@font-face方式实现个性化字体
当我们在浏览一些网站时发现,里面含有一些十分个性的字体,这些字体并不是我们电脑上安装的字体.那么css是如何实现自定义字体的呢? 资源网站大全https://55wd.com 在css3中可以通过@f ...
- CSS3 使用自定义字体
CSS3 @font-face 规则 在 CSS3 之前,web 设计师必须使用已在用户计算机上安装好的字体.通过 CSS3,web 设计师可以使用他们喜欢的任意字体.当您您找到或购买到希望使用的字体 ...
- css3之自定义字体
使用@font-face自定义字体 我们在浏览国外的一些个人网站时,总是可以发现一些非常个性的字体,比如
- css3中的自定义字体
自定义字体 /*定义*/ @font-face { font-family: "icons"; src: url("icomoon.eot"); src: lo ...
- 在前端页面中使用@font-face来显示web自定义字体【转】
本文转自W3CPLUS 的<CSS @font-face> @font-face是CSS3中的一个模块,他主要是把自己定义的Web字体嵌入到你的网页中,随着@font-face模块的出现, ...
- 01_MUI之Boilerplate中：HTML5示例，动态组件，自定义字体示例，自定义字体示例，图标字体示例
1安装HBuilder5.0.0,安装后的界面截图如下: 2 按照https://www.muicss.com/docs/v1/css-js/boilerplate-html中的说明,创建上图的 ...
- fontforge制作自定义字体及在手机上应用举例——张鑫旭
一.看似无关紧要的事件背景 之所以花时间折腾fontforge这个软件,去制作什么自定义的字体是有原因滴. 之前提过,最近我抽空将公司的手机软件HTML5网页化.期间碰到这么一个问题,页面低栏上的电话 ...
随机推荐
- 洛谷 P2360 地下城主
P2360 地下城主 题目描述 你参加了一项秘密任务,在任务过程中你被困在了一个3D的地下监狱里面,任务是计时的,你现在需要在最短的时间里面从地牢里面逃出来继续你的任务.地牢由若干层组成,每一层的形状 ...
- 可变参数的实现my_sprintf
#include "stdafx.h" #include <stdio.h> #include <stdarg.h> void my_sprintf(cha ...
- Linux下基于LDAP统一用户认证的研究
Linux下基于LDAP统一用户认证的研究 本文出自 "李晨光原创技术博客" 博客,谢绝转载!
- 给VG增加磁盘，给文件目录增加空间
一: #lspv 找到新增加的物理卷(逻辑驱动器,以hdisk8为例). #chdev –l hdisk8 –a pv=yes写入新的物理卷的pvid. #extendvg cwdatavg hdis ...
- do_pj--下拉代码脚本的使用
接本目录 /home/zhangshuli/git2/vanzo_team/xulei/Platform.py 在~/bin目录下链接 ln -sf ~/git2/vanzo_team/xulei/P ...
- ua识别（浏览器标识识别）
ua识别(浏览器标识识别) 一.总结 1.浏览器标识(UA):可以使得服务器能够识别客户使用的操作系统及版本.CPU 类型.浏览器及版本.浏览器渲染引擎.浏览器语言.浏览器插件,从而判断用户是使用电脑 ...
- JQuery操作数组函数 push(),pop(),unshift(),shift()
1.array.push() :在数组尾部添加新的元素,并返回新的数组长度. 2.array.unshift() :在数组头部添加新的元素,并返回新的数组长度.[听说IE浏览器不支持] 3.array ...
- Django环境搭建（二）
web框架 本质就是socket服务端 socket服务端:是计算机科学家在TCP/IP基础上进行封装,暴露出一个接口socket,就是一个收发数据的一个接口. 对于真实的web程序来说分为两部分:服 ...
- app 自动化测试 Appium+python可以运行的代码
Appium
- 【2017 Multi-University Training Contest - Team 10】Schedule
[链接]http://acm.hdu.edu.cn/contests/contest_showproblem.php?pid=1010&cid=767 [题意] 给一些区间,每台机器在这些区间 ...