CSS 字体样式

介绍

CSS（层叠样式表）是一种用于控制网页样式和布局的样式表语言。CSS 字体样式用于定义网页中文本的外观效果，包括字体、大小、行高、粗斜体等。

本文将介绍 CSS 字体样式的常见属性和使用方法。

字体系列

font-family 属性用于设置文本的字体系列。字体系列可以是一个或多个字体名称的列表，浏览器将按照列表中的顺序逐一查找可用的字体。

p {
  font-family: Arial, sans-serif;
}

在上面的例子中，Arial 是首选字体，如果该字体不可用，浏览器将使用后备的无衬线字体（sans-serif）替代。

字体大小

font-size 属性用于设置文本的字体大小。

h1 {
  font-size: 24px;
}

可以使用相对单位（em、rem）或绝对单位（px、pt）来指定字体大小。

字体样式

font-style 属性用于设置文本的样式，如斜体、正常等。

em {
  font-style: italic;
}

strong {
  font-style: normal;
}

font-weight 属性用于设置文本的粗细。

h2 {
  font-weight: bold;
}

font-variant 属性用于设置文本的变体，如小型大写字母。

span {
  font-variant: small-caps;
}

行高

line-height 属性用于设置文本所在行的高度。

p {
  line-height: 1.5;
}

可以使用相对单位或绝对单位来指定行高。

文本装饰

text-decoration 属性用于设置文本的装饰效果，如下划线、删除线等。

a {
  text-decoration: underline;
}

del {
  text-decoration: line-through;
}

文本对齐

text-align 属性用于设置文本的对齐方式，包括左对齐、右对齐、居中等。

p {
  text-align: center;
}

总结

本文介绍了 CSS 字体样式的常见属性和使用方法，包括字体系列、字体大小、字体样式、行高、文本装饰和文本对齐等。通过灵活使用这些属性，可以实现丰富多样的字体效果。