购物车
登陆 / 注册
微信扫码登陆

推荐手册

CSS3 字体

CSS3 字体
通过 CSS3我们可以使用任意字体,当找到或购买到希望使用的字体时,可将该字体文件存放到 web 服务器上,它会在需要时被自动下载到用户的计算机上
编辑:前端控 前端控 更新时间:2019-02-01 10:43:20

CSS3 字体

CSS3 @font-face 规则

在 CSS3 之前,在网页中必须使用已在用户计算机上安装好的字体,但是现如今通过 CSS3,我们可以使用喜欢的任意字体。

当找到或购买到希望使用的字体时,可将该字体文件存放到 web 服务器上,它会在需要时被自动下载到用户的计算机上。

“自己的”的字体是在 CSS3 @font-face 规则中定义的

浏览器支持:

属性
                                                              浏览器支持
@font-face

        

                             

注意:Internet Explorer 8 以及更早的版本不支持新的 @font-face 规则

自定义字体:

在新的 @font-face 规则中,必须首先定义字体的名称(比如 myFirstFont),然后指向该字体文件。

如需为 HTML 元素使用字体,请通过 font-family 属性来引用字体的名称 (myFirstFont)

实例

@font-face
{
font-family: myFirstFont;
src: url(Sansation-Italic.ttf)
}
div
{
font-family:myFirstFont;
}

运行实例 »

点击 "运行实例" 按钮查看在线实例

效果图:

CSS3 字体描述符

下面的表格列出了能够在 @font-face 规则中定义的所有字体描述符

描述符描述
font-family name必需。规定字体的名称
srcURL必需。定义字体文件的 URL
font-stretch

normal

condensedultra-condensed

extra-condensed

semi-condensed

expanded

semi-expanded

extra-expanded

ultra-expanded

可选。定义如何拉伸字体。默认是 "normal"
font-style

orma

litalic

oblique 

可选。定义字体的样式。默认是 "normal"
font-weight

normal

bold

100

200

300

400

500

600

700

800

900

可选。定义如何拉伸字体。默认是 "normal"
unicode-range unicode-range 可选。定义字体支持的 UNICODE 字符范围。默认是 "U+0-10FFFF"
网站导航
网站首页
学习路径
视频教程
开发软件
旗下子站
php中文网
phpstudy
技术文章
文档工具
关于我们
企业合作
人才招聘
联系我们
讲师招募
QQ交流群
QQ交流群
微信公众号
微信公众号