更新时间:2024-01-11 16:00
font-family 可以把多个字体名称作为一个“回退”系统来保存。如果浏览器不支持第一个字体,则会尝试下一个。也就是说,font-family 属性的值是用于某个元素的字体族名称或/及类族名称的一个优先表。浏览器会使用它可识别的第一个值。
初学者可能会觉得很疑惑。为什么要为元素同时定义多个字体呢。
设定优先级
设计页面时一般设计师会选定特定的一个字体以达到理想的效果,但更多情况下用户的电脑可能没有安装该字体。此时就要用font-family设定一个列表,靠前的字体优先显示,如果没有安装则往后轮一个,以此类推。保证网页不会因为没有相应字体就被系统使用了不好看的字体。
举个例子:
中西文分别指定字体
设计页面时有时会遇到中文和西文需要使用不同字体搭配使用的情况,这时就要把西文字体靠前放。因为西文字体只包含字母和数字而不包含汉字,在高优先级下被使用时汉字自然会轮到优先级低的字体来显示。如果中文字体优先级较高,则会导致指定的西文字体不会被显示。
举个例子:
Windows平台的默认情况下,浏览器的字体是宋体。中文字体常用的有宋体、微软雅黑,英文字体比较常用的有Times New Roman、Arial。
所有主流浏览器都支持 font-family 属性。
注释:任何的版本的 Internet Explorer (包括 IE8)都不支持属性值