CSS3教程

当前位置: HTML5技术网 > CSS3教程 > 使用CSS3 @font-face实现个性化字体

使用CSS3 @font-face实现个性化字体

      在网页中,我们可以用CSS的font-family属性来定义字体,然而定义的字体在用户的电脑上能否正确呈现则要看用户的电脑是否安装了该字体。我们经常能看到国外的一些个人网站使用了非常漂亮的字体,而这些字体通常在用户的电脑中是没有安装的,所以用font-family属性就无法实现了,今天我们就介绍使用@font-face实现个性化字体。

CSS3 @font-face

  说@font-face是CSS3的新特性并不准确,因为CSS2就已经支持了这一特性,并且Internet Explorer早在第5版的时候就已经支持它了,不过IE实现方式是通过自有的eot(Embeded Open Type)字体格式,其它浏览器都不支持这个格式。@font-face支持如下属性:

  font-family:设置文本的字体名称。

  font-style:设置文本样式。

  font-variant:设置文本是否大小写。

  font-weight:设置文本的粗细。

  font-stretch:设置文本是否横向的拉伸变形。

  font-size:设置文本字体大小。

  src:设置自定义字体的相对路径或者绝对路径。

  @font-face浏览器兼容性如下:

【使用CSS3 @font-face实现个性化字体】相关文章

1. 使用CSS3 @font-face实现个性化字体

2. CSS3 HTML5实例五(使用 @Font-Face 实现定制字体)

3. CSS3系列教程:嵌入字体/网络字体

4. Telefónica与Mozilla开拓基于HTML5互联网设备

5. CSS3 animate实现图片墙3D翻转效果

6. 使用CSS3 BACKFACE-VISIBILITY属性制作翻转动画效果

7. 利用CSS3 Gradients创建无图片水晶按钮

8. Chrome实验网站:各种新奇事物让你爱不释手

9. 站在HTML5技术最前端的Chrome实验

10. 解析中文字体在CSS中的表达方式

本文来源:https://www.51html5.com/a853.html

点击展开全部

﹝使用CSS3 @font-face实现个性化字体﹞相关内容

「使用CSS3 @font-face实现个性化字体」相关专题