CSS进阶（十六）font

[ [ font-style || font-variant || font-weight ]? font-size [ / line-height ]? font-family ]

font-size 和 font-family 这两个属性需要同时存在

注意

font中如果未声命line-height则会将line-height重置为normal

避免过长font-family的写法

（1）可以随便找一个系统根本不存在的字体名占位

（2）使用font-face

font属性的关键字

font:caption | icon | menu | message-box | small-caption | status-bar

• caption：活动窗口标题栏使用的字体。

• icon：包含图标内容所使用的字体，如所有文件夹名称、文件名称、磁盘名称，甚至 浏览器窗口标题所使用的字体。

• menu：菜单使用的字体，如文件夹菜单。

• message-box：消息盒里面使用的字体。

• small-caption：调色板标题所使用的字体。

• status-bar：窗体状态栏使用的字体。

在使用 font 属性的时候，要避开 caption、 icon 和 message-box 这 3 个关键字

在实际使用时，我们还需要在一下面再设 定一下 font-size 大小来保证一致性

html {
 font: menu;
 font-size: 16px;
} 

应用

在控制不同平台显示字体的时候，最好的方式便是采用系统的默认字体，借由font的关键字属性实现

html { font: menu; }
body { font-size: 16px; } 

html { font: small-caption; }
body { font-size: 16px; }

html { font: status-bar; }
body { font-size: 16px; } 

最大的好处便是网站字体能时时刻刻 与时俱进