font-family

 最近看了一些牛掰博主的文章,对字体有了新的认识。

 字体家族font-family主要分为衬线字体和无衬线字体

 web常用的字体类型:  

  • serif(衬线)
  • sans-serif(无衬线)
  • monospace(等宽)
  • fantasy(梦幻)
  • cuisive(草体) 

    serif(衬线)

  serif,意为有衬线的字体,衬线的意思是在字符笔画末端有叫做衬线的小细节的额外装饰,而且笔画的粗细会有所不同,这些细节在大写字母中特别明显。

     属于衬线的字体有宋体、Times New Roman(Mac 平台 Safari 下默认的英文字体,是最常见且广为人知的西文衬线字体之一,众多网页浏览器和文字处理软件都是用它作为默认字体。)

 sans-serif -- 无衬线字体

  sans-serif 也就是无衬线的意思。专指西文中没有衬线的字体,与汉字字体中的黑体相对应。与衬线字体相反,该类字体通常是机械的和统一线条的,它们往往拥有相同的曲率,笔直的线条,锐利的转角。

    中文下,无衬线字体就是黑体,黑体字也就是又称方体或等线体,没有衬线装饰,字形端庄,笔画横平竖直,笔迹全部一样粗细。

     属于无衬线的字体有微软雅黑(Microsoft Yahei)、华文黑体(STHeiti)、华文细黑(STXihei)、黑体-简(Heiti SC)、冬青黑体(Hiragino Sans GB)、Helvetica | Helvetica Neue(被广泛用于全世界使用拉丁字母和西里尔字母的国家。Helvetica 是苹果电脑的默认字体,微软常用的Arial 字体也来自于它)、Arial(Windows 平台上默认的无衬线西文字体,有多种变体,比例及字重(weight)和 Helvetica 极为相近)、Verdana(无衬线字体,优点在于它在小字上仍结构清晰端整、阅读辨识容易)、Tahoma(字体结构和 Verdana 很相似,对 Unicode 字集的支持范围较大,可以替代Arial 字体)

  

  monospace -- 等宽字体

    等宽字体是指字符宽度相同的电脑字体,常见于 IDE 或者编辑器中,每个字母的宽度相等,通常用于计算机相关书籍中排版代码块。

   

  fantasy 、cuisive

       fantasy和 cuisive 字体在浏览器中不常用,在各个浏览器中有明显的差异。

   注:在浏览器中定义字体库时要注意几点要求      

  • 比如我们要用宋体时,font-family:"宋体",这样写可能会出现因为字符编码问题而出现问题,有两种方法
    • 用英文来写,eg:font-family:"SimSun"
    • 转化为unicode 编码,eg:font-family:"5b8b4f53",各个字体都有自己的编码
  • 在写多个字体类型时加单双引号,eg:font-family:"SimSun","sans-serif"
  • 写字体类型时要注意兼容问题,系统兼容和中西文字的兼容,
    • 西文在前,中文在后,eg:font-family:"5b8b4f53",
    • 要兼顾各个操作系统,系统中安装的字体不一样,eg:MAC OS 下的很多中文字体在 Windows 都没有预装,为了保证 MAC 用户的体验,在定义中文字体的时候,先定义 MAC 用户的中文字体,再定义 Windows 用户的中文字体。其次很多人都不知道 Android 下没有预装微软雅黑和宋体,那么 Android 机型下的中文字体设置又是很考究的。
  • 要兼顾旧操作系统,就像你写的页面要兼容IE的低版本一样,在使用新字体时要考虑没有安装新字体,考虑向下兼容
    •   使用字体族系列 serif 和sans-serif 结尾总归是不错的选择

  参考文章:http://www.cnblogs.com/coco1s/p/6253154.html

原文地址:https://www.cnblogs.com/white-bull/p/7994660.html