CSS字体

• CSS字体属性定义文本的字体系列、大小、加粗、风格（如斜体）和变形（如小型大写字母）

• 在 CSS 中，有两种不同类型的字体系列名称：
  * 通用字体系列 - 拥有相似外观的字体系统组合（比如 “Serif” 或 “Monospace”）
  * 特定字体系列 - 具体的字体系列（比如 “Times” 或 “Courier”）

  • 除了各种特定的字体系列外，CSS 定义了 5 种通用字体系列：
    • Serif 字体
    • Sans-serif 字体
    • Monospace 字体
    • Cursive 字体
    • Fantasy 字体

• 指定字体：

  • font-family属性：
    • 使用通用字体：
      *body{font-family:scans-serif;}
      • 或者当有多个字体时，用逗号分隔开不同字体，当一个字体中有空格出现时需要将此字体用单引号引起来，如：

      // 
      var foo = 'bar';
      <p style="font-family: Times, TimesNR, 'New Century Schoolbook', Georgia,'New York', serif;">...</p>
      

• 字体风格：

  • font-style：
    * normal：文本正常显示
    * italic：文本斜体显示
    * pblique：文本倾斜显示

• 字体变形：

  • font-variant：
    * 可以设定小型大写字母：小型大写字母不是一般的大写字母，也不是小写字母，这种字母采用不同大小的大写字母

• 字体加粗：

  • font-weight：（100-900为字体指定了9级加粗度）
    * bold：将文本设置为粗体 700
    *如果将元素的加粗设置为 bolder，浏览器会设置比所继承值更粗的一个字体加粗。与此相反，关键词 lighter 会导致浏览器将加粗度下移而不是上移

• 字体大小：

  • font-size：像素/em表示
    *em：
    1em 等于当前的字体尺寸。如果一个元素的 font-size 为 16 像素，那么对于该元素，1em 就等于 16 像素。在设置字体大小时，em 的值会相对于父元素的字体大小改变。
    浏览器中默认的文本大小是 16 像素。因此 1em 的默认尺寸是 16 像素。
    可以使用下面这个公式将像素转换为 em：pixels/16=em