如何用 CSS 设置字体

在网页设计中，CSS（层叠样式表）是设置字体的强大工具。通过合理运用 CSS，能让网页的文字呈现出独特且吸引人的效果。下面就来详细了解如何用 CSS 设置字体。

要设置字体的类型。使用 font-family 属性，它可以指定一个或多个字体名称。例如，font-family: Arial, sans-serif; 表示首选 Arial 字体，如果用户系统中没有 Arial 字体，则会使用 sans-serif 这种通用字体。通用字体包括 serif（衬线字体）、sans-serif（无衬线字体）、monospace（等宽字体）等。

字体大小的设置也很关键。利用 font-size 属性可以轻松调整。常见的单位有像素（px）、em、rem 等。以像素为单位时，如 font-size: 16px;，会固定字体的大小。而 em 是相对单位，它相对于父元素的字体大小。比如父元素字体大小是 16px，设置子元素 font-size: 1.5em;，那么子元素字体大小就是 16×1.5 = 24px。rem 则是相对于根元素（html 元素）的字体大小，使用它能方便地进行页面整体字体大小的统一调整。

字体的粗细能够影响文字的视觉效果。通过 font-weight 属性来设置，常见的值有 normal（正常粗细）、bold（加粗），也可以使用 100 - 900 的数字来精确控制，400 等同于 normal，700 等同于 bold。

文字的样式，如是否倾斜，可通过 font-style 属性实现。取值有 normal（正常样式）、italic（斜体）、oblique（倾斜体，与 italic 有细微差别）。

另外，文字的行高也是需要关注的一点。使用 line-height 属性可以调整行与行之间的距离。例如 line-height: 1.6; 表示行高是字体大小的 1.6 倍，合适的行高能提升文字的可读性。

最后，文字的颜色设置必不可少。使用 color 属性，既可以用颜色名称，如 color: red;，也可以用十六进制代码，如 color: #FF0000;，还能用 RGB 或 RGBA 模式，如 color: rgba(255, 0, 0, 0.5); 中的 RGBA 模式可以设置透明度，这里的透明度为 0.5。

通过这些 CSS 属性的灵活运用，就能为网页打造出丰富多样、美观易读的字体效果，提升用户体验和网页的整体质量。