css3之字体@font-face
@font-face能够加载服务器端的字体文件,让浏览器端可以显示用户电脑里没有安装的字体。
浏览器支持
表格中的数字表示支持该属性的第一个浏览器版本号。

Firefox, Chrome, Safari, 和 Opera 支持 .ttf(True Type字体)和.otf(OpenType)字体字体类型)。Internet Explorer 9+, Firefox, Chrome, Safari, 和 Opera 支持 WOFF (Web Open Font Format) 字体.
Chrome, Safari 和 Opera 也支持 SVG 字体/折叠.
Internet Explorer 同样支持 EOT (Embedded OpenType) 字体.
注意: Internet Explorer 8 以及更早的版本不支持新的 @font-face 规则。
语法:
@font-face {
font-family : 字体名称;
src : 字体文件在服务器上的相对或绝对路径;
}
这样设置之后,就可以像使用普通字体一样在(font-*)中设置字体样式。
比如:
p {
font-size :12px;
font-family : "My Font";
/*必须项,设置@font-face中font-family同样的值*/
}
css3之字体@font-face的更多相关文章
- 【CSS3】字体font
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- css3 web字体记
css3 web字体 @font-face语法 @font-face能够加载服务器端的字体,让客户端浏览器显示客户端没有安装的字体. @font-face{ font-family:<YourW ...
- css3文本字体
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- W3School-CSS 字体(font)实例
CSS 字体(font)实例 CSS 实例 CSS 背景实例 CSS 文本实例 CSS 字体(font)实例 CSS 边框(border)实例 CSS 外边距 (margin) 实例 CSS 内边距 ...
- Android Studio 3.1.2 修改字体(font)大小(size) 及老版本修改主题、字体、颜色 参照地址
Android Studio 3.1.2 修改字体(font)大小(size) 步骤:File-Settings-Editor-Color Scheme-Color Scheme Font-Size ...
- CSS 字体(font)实例
CSS 字体(font)实例CSS 字体属性定义文本的字体系列.大小.加粗.风格(如斜体)和变形(如小型大写字母).CSS 字体系列在 CSS 中,有两种不同类型的字体系列名称: 通用字体系列 - 拥 ...
- CSS3 更改字体被选中样式
CSS3 更改字体被选中样式
- css3控制字体动态变换颜色
css3控制字体动态变换颜色 <!doctype html> <html> <head> <meta charset="utf-8"> ...
- CSS3实现字体描边
CSS3实现字体描边的两种方法 -webkit-text-stroke: 1px #fff;:不建议,向内描边,字体颜色变细,效果不佳: 用box-shadow模拟描边,向外描边,保留字体粗细,赞! ...
- css3 自定义字体的使用方法
@font-face是CSS3中的一个模块,他主要是把自己定义的Web字体嵌入到你的网页中,随着@font-face模块的出现,我们在Web的开发中使用字体不怕只能使用Web安全字体,你们当中或许有许 ...
随机推荐
- OpenCV-Python Tutorials目录
版本 3.4.6 1 Introduction to OpenCV OpenCV介绍Learn how to setup OpenCV-Python on your computer! 2 Gui F ...
- 2019牛客暑期多校训练营(第七场) E 线段树+离散化
题目传送门 题意:按照一定的公式给出若干个$<l,r>$,每次往一个序列中加上l到r的数字,并输出中位数. 思路:需要将每个$区间$离散化,比如把$[1,2]$变成$[1,3)$,也就是$ ...
- mock.js使用教程
转载自:https://blog.csdn.net/qq_42205731/article/details/81705350 cdn引入文件 :<script src="http:// ...
- flex:1将页面铺满
代码示范: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...
- mysql 存储过程学习 汇总
存储过程框架 DEMILITER $$ -- 重定义符 DROP PROCEDURE IF EXISTS store_procedure$$ -- 如果存在此名的存储过程,先删除 CREATE PRO ...
- 强连通图缩点——cf999E
问题转换成缩点求度数为0的点的个数,s点所在联通块作额外处理 缩点写的很烂调了一早上.. #include<bits/stdc++.h> #include<vector> us ...
- bsgs+求数列通项——bzoj3122(进阶指南模板该进)
/* 已知递推数列 F[i]=a*F[i-1]+b (%c) 解方程F[x]=t an+1 = b*an + c an+1 + c/(b-1) = b(an + c/(b-1)) an+1 + c/( ...
- SpringBoot_04_SpringBoot对ssm的整合
1.在SpringBoot框架下对ssm进行整合 2.搭建一个web的SpringBoot框架 2.1添加pom.xml坐标(需要加上SpringBoot对jsp的支持,和对资源文件位置的说明) &l ...
- exit与return的区别
===========================PHP的解释=========================================================== return ...
- day 69 Django基础五之django模型层(一)单表操作
Django基础五之django模型层(一)单表操作 本节目录 一 ORM简介 二 单表操作 三 章节作业 四 xxx 一 ORM简介 MVC或者MVC框架中包括一个重要的部分,就是ORM,它实现 ...