HTML5的字体样式设置方法

字体样式

font-style 属性主要用于指定斜体文本。

此属性可设置三个值：

• normal - 文字正常显示
• italic - 文本以斜体显示
• oblique - 文本为“倾斜”（倾斜与斜体非常

  p.normal {
    font-style: normal;
  }
  
  p.italic {
    font-style: italic;
  }
  
  p.oblique {
    font-style: oblique;
  }

  ---

  字体粗细

  font-weight 属性指定字体的粗细：

• p.normal {
    font-weight: normal;
  }
  
  p.thick {
    font-weight: bold;
  }

  ---

  字体变体

  font-variant 属性指定是否以 small-caps 字体（小型大写字母）显示文本。

  在 small-caps 字体中，所有小写字母都将转换为大写字母。但是，转换后的大写字母的字体大小小于文本中原始大写字母的字体大小。

  p.normal {
    font-variant: normal;
  }
  
  p.small {
    font-variant: small-caps;
  }

  ---

  字体大小

• font-size 属性设置文本的大小。

  在网页设计中，能够管理文本大小很重要。但是，不应使用调整字体大小来使段落看起来像标题，或是使标题看起来像段落。

  请始终使用正确的 HTML 标签，例如 <h1> - <h6> 用于标题，而 <p> 仅用于段落。

  font-size 值可以是绝对或相对大小。

  ---

  以像素设置字体大小

  使用像素设置文本大小可以完全控制文本大小

• h1 {
    font-size: 40px;
  }
  
  h2 {
    font-size: 30px;
  }
  
  p {
    font-size: 14px;
  }

  ---

  字体属性

  为了缩短代码，也可以在一个属性中指定所有单个字体属性。

  font 属性是以下属性的简写属性：

• font-style
• font-variant
• font-weight
• font-size/line-height
• font-family
• 注意：font-size 和 font-family 的值是必需的。如果缺少其他值之一，则会使用其默认值。