@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的更多相关文章

  1. 【CSS3】字体font

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  2. css3 web字体记

    css3 web字体 @font-face语法 @font-face能够加载服务器端的字体,让客户端浏览器显示客户端没有安装的字体. @font-face{ font-family:<YourW ...

  3. css3文本字体

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. W3School-CSS 字体(font)实例

    CSS 字体(font)实例 CSS 实例 CSS 背景实例 CSS 文本实例 CSS 字体(font)实例 CSS 边框(border)实例 CSS 外边距 (margin) 实例 CSS 内边距 ...

  5. Android Studio 3.1.2 修改字体(font)大小(size) 及老版本修改主题、字体、颜色 参照地址

    Android Studio 3.1.2  修改字体(font)大小(size) 步骤:File-Settings-Editor-Color Scheme-Color Scheme Font-Size ...

  6. CSS 字体(font)实例

    CSS 字体(font)实例CSS 字体属性定义文本的字体系列.大小.加粗.风格(如斜体)和变形(如小型大写字母).CSS 字体系列在 CSS 中,有两种不同类型的字体系列名称: 通用字体系列 - 拥 ...

  7. CSS3 更改字体被选中样式

    CSS3  更改字体被选中样式

  8. css3控制字体动态变换颜色

    css3控制字体动态变换颜色 <!doctype html> <html> <head> <meta charset="utf-8"> ...

  9. CSS3实现字体描边

    CSS3实现字体描边的两种方法 -webkit-text-stroke: 1px #fff;:不建议,向内描边,字体颜色变细,效果不佳: 用box-shadow模拟描边,向外描边,保留字体粗细,赞! ...

  10. css3 自定义字体的使用方法

    @font-face是CSS3中的一个模块,他主要是把自己定义的Web字体嵌入到你的网页中,随着@font-face模块的出现,我们在Web的开发中使用字体不怕只能使用Web安全字体,你们当中或许有许 ...

随机推荐

  1. exe4j 打包(多个jar打包)

    一,自行下载exe4j 注册码: 用户名和公司名可随便填A-XVK258563F-1p4lv7mg7savA-XVK209982F-1y0i3h4ywx2h1A-XVK267351F-dpurrhny ...

  2. Java 多线程 - 锁的类型

    https://zhuanlan.zhihu.com/p/37287566 https://www.cnblogs.com/qifengshi/p/6831055.html

  3. 关于 argc 和 argv

    https://stackoverflow.com/questions/3898021/regarding-mainint-argc-char-argv 当使用命令行启动程序,或者给程序传输参数时,可 ...

  4. Json数据交换一Jackson

    依赖 <dependency> <groupId>com.fasterxml.jackson.core</groupId> <artifactId>ja ...

  5. Windows 设置内网和外网同时使用

    想要电脑同时使用内网和外网必须具备两个网卡,一个是无线网卡一个是本地连接,无线网卡用来连接wifi也就是外网,而本地连接需要网线连接内网,外网是不需要做设置的,我们只需要设置内网即可,鼠标右击电脑右下 ...

  6. BZOJ 1296(SCOI 2009) 粉刷匠

    1296: [SCOI2009]粉刷匠 Time Limit: 10 Sec Memory Limit: 162 MB Submit: 2544 Solved: 1466 [Submit][Statu ...

  7. webstorm 初次上传代码到 远程gitlab中

    1. 在 公司搭建的gitlab网站,创建project,然后生成了 git的地址. 2.在 本地电脑上,打开 webstorm,要将已有的代码上传到 git网站,那么需要在webstrom编辑器的t ...

  8. 出现不不能引java.util.Date包的情况

    出现不不能引java.util.Date包的情况 那个时间段不能引,IDE的bug,等一会儿就好了 心得:很多时候没必要和bug死磕,因为真的不是你的问题.

  9. swiper在loop模式,当轮播到最后一张图时候,做其他事件

    1.引入文件: <link rel="stylesheet" href="css/swiper.min.css"> <script src=& ...

  10. 如何在VUE项目中使用SCSS

    首先要了解什么是CSS 预处理器? SCSS是一种CSS预处理语言 定义了一种新的专门的编程语言,编译后形成正常的css文件,为css增加一些编程特性,无需考虑浏览器的兼容性(完全兼容css3),让c ...