font-family

语法

  • font-family:[ <family-name> | <generic-family> ] #
  • <family-name> = arial | georgia | verdana | helvetica | simsun and etc.
  • <generic-family> = cursive | fantasy | monospace | serif | sans-serif
  • 默认值:由user agent决定
  • 适用于:所有元素
  • 继承性:有
  • 动画性:否
  • 计算值:指定值

取值

  • <family-name>:字体名称。按优先顺序排列。以逗号隔开。如果字体名称包含空格或中文,则应使用引号括起
  • <generic-family>:字体序列名称。

说明

设置或检索用于对象中文本的字体名称序列。

  • 序列可包含嵌入字体。请参阅@font-face规则。
  • 一般字体引用可以不加引号,如果字体名包含了空格、数字或者符号(如连接符)则需加上引号,避免引发错误。
  • user agent会遍历定义的字体序列,直到匹配到某个字体为止。
  • 指定字体序列:

写法:

body { font-family: helvetica, verdana, sans-serif; }

如上字体定义,假设你机器上没有helvetica字体,但有verdana,这时将会以verdana显示你的文字。

  • 对应的脚本特性为fontFamily。

兼容性

Values IE Firefox Chrome Safari Opera iOS Safari Android Browser Android Chrome
Basic Support 6.0+ 2.0+ 4.0+ 3.1+ 3.5+ 3.2+ 2.1+ 18.0+

示例


<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
<style>
.test {
    font-family: arial, georgia, verdana, simsun, helvetica, sans-serif;
}
</style>
</head>
<body>
<div class="test">使用字体名称和字体序列名称定义字体。</div>
</body>
</html>