CSS3 @font-face 规则
指定名为"myFirstFont"的字体,并指定在哪里可以找到它的URL:
@font-face
{
font-family: myFirstFont;
src: url('Sansation_Light.ttf'),
url('Sansation_Light.eot'); /* IE9 */
}
以下实例为在div中使用的字体:
div
{
font-family: myFirstFont;
}
语法
@font-face
{
font-properties
}
字体描述 | 值 | 说明 |
---|---|---|
font-family | name | 必需的。定义字体的名称。 |
src | URL | 必需的。定义该字体下载的网址(S) |
font-stretch | normal condensed ultra-condensed extra-condensed semi-condensed expanded semi-expanded extra-expanded ultra-expanded |
可选。定义该字体应该如何被拉长。默认值是"正常" |
font-style | normal italic oblique |
可选。定义该字体应该是怎样样式。默认值是"正常" |
font-weight | normal bold 100 200 300 400 500 600 700 800 900 |
可选。定义字体的粗细。默认值是"正常" |
unicode-range | unicode-range | 可选。定义该字体支持Unicode字符的范围。默认值是"ü+0-10 FFFF" |
CSS3 @font-face 规则的更多相关文章
- [转]真正了解CSS3背景下的@font face规则
本文转自:http://www.zhangxinxu.com/wordpress/2017/03/css3-font-face-src-local/ by zhangxinxu from http:/ ...
- CSS3:@font-face规则
前言 过去,Web设计师为了保证网站能够正常显示,只能使用“Web安全字体”,即每台机器都预装的字体.但Web安全字体有时并不好看... @font-face能够使得任何一台机器能够显示理想中的字体. ...
- css font简写规则
是不是在很很多网站的公共样式中会看到这样的代码?font: 12px/150% Arial, Verdana, "\5b8b\4f53";意思为:字体大小/行高 字体族 " ...
- IT兄弟连 HTML5教程 CSS3揭秘 CSS规则的组成
CSS和HTML一样都是由W3C制定的标准,本章中介绍的特性和功能还是来源于CSS1和CSS2(CSS2是根据CSS1扩展的).W3C也有新的版本更新,称为CSS3.虽然浏览器已经准备开始实现CSS3 ...
- CSS3高性能动画
CSS动画属性会触发整个页面的重排relayout.重绘repaint.重组recomposite Paint通常是其中最花费性能的,尽可能避免使用触发paint的CSS动画属性,在CSS动画中使用w ...
- CSS自学笔记(12):CSS3文字特效
在CSS3中新增了多个文本属性,同样有了这些属性我们在进行问题特效处理时,就尽可能少的用到其他软件去制作特效文字了. 在以前使用CSS进行web开发的时候,必须使用计算机上安装好的字体,如果有些用户的 ...
- CSS3+HTML5特效7 - 特殊的 Loading 效果
效果如下 实现原理: 利用CSS3的@keyframes规则创建动画效果: 使用CSS3的animation效果完成滚动切换. 代码说明: 样式表中@-webkit-keyframes及@ke ...
- CSS3+HTML5特效4 - 横向无缝滚动
先看例子 This is a test 1. This is a test 2. This is a test 3. This is a test 4. This is a test 5. This ...
- CSS3+HTML5特效3 - 纵向无缝滚动
老惯例,先看例子. This is a test 1. This is a test 2. This is a test 3. This is a test 4. This is a test 5. ...
- 个人练习:使用HTML+CSS3制作图片轮播功能(不使用JavaScript)
先上效果图,不要在意用来当素材的图片: 在搜索相关资料的时候,查到有两种实现方式:一是使用JavaScript,二是使用CSS3中的Animation(动画),这里使用的是CSS3中的Animatio ...
随机推荐
- C博客作业
1.你对网络专业或者计算机专业了解是怎样? 信息化是国企的一个大趋势,目前正是红火的时候. - 网络是信息化必不可少的的基础和平台,随着信息化的进步,网络也必将水涨船高. - 我认为网络方向主要学的是 ...
- mysql开放远程连接
1.检查端口是否被监听,没有的话请启动mysql. netstat -atnp | grep 3306 2.检查用户是否具备远程连接,即host字段值不是 % mysql -uroot -p你的密码 ...
- 「ZJOI2019」麻将
传送门 Solution 对于条件一:记录一个\(cnt\)表示牌个数\(≥2\)的个数 设\(dp_{i,0/1,j,k}\)表示考虑了\(1...i\),当前是否有对子,以\(i-1\),\(i ...
- Markdown 打出上下标
1. 打上标,下标 2<sup>10</sup> <!--下标--> 2.同时打上下标 $x^p_ {ij}$ <!--上标为p,下标为ij,{}是用来组合i ...
- LOL佐伊官方手办
花199元在某宝上买的官方正版佐伊手办终于到了,话不多说直接上图! 虽然脸有点不切实际的大,但还是很可爱~
- Python3 fake_useragent 模块的使用和报错解决方案
在使用 Python 做爬虫的时候,我们需要伪装头部信息骗过网站的防爬策略,Python 中的第三方模块 fake_useragent 就很好的解决了这个问题,它将给我们返回一个随机封装了好的头部信息 ...
- Java URLDecoder和URLEncoder对中文进行编码和解码
URLDecoder类包含一个decode(String s,String enc)静态方法,它可以将application/x-www-form-urlencoded MIME字符串转成普通字符串: ...
- Netty回调与Channel执行流程分析
在上一篇的基础上修改代码 1.TestHttpServerHandle 类 package com.example.firstexample; import io.netty.buffer.Byte ...
- Leetcode: Find And Replace in String
To some string S, we will perform some replacement operations that replace groups of letters with ne ...
- ISO/IEC 9899:2011 条款6.9.2——外部对象定义
6.9.2 外部对象定义 语义 1.如果对一个对象的标识符的声明具有文件作用域以及一个初始化器,那么该声明是对该标识符的一个外部定义. 2.对于具有文件作用域且没有一个初始化器.没有一个存储类说明符, ...