CSS 如何在div内设置字体和字号

在本文中，我们将介绍如何在CSS中设置div内的字体和字号。CSS可以通过样式规则来控制HTML文档的外观和布局，其中包括设置字体和字号。

阅读更多：CSS 教程

设置字体

要设置div内的字体，我们可以使用CSS的font-family属性。这个属性用于指定字体的名称或字体系列。

示例代码：

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

上述代码将设置div内的文字为Arial字体。如果用户计算机中没有安装Arial字体，浏览器将使用sans-serif字体作为备选。

如果需要设置多个字体系列作为备选，可以使用逗号分隔它们。浏览器将按照优先级依次尝试安装这些字体。

div {
  font-family: Arial, Helvetica, sans-serif;
}

上述代码将按照顺序尝试安装Arial、Helvetica和sans-serif字体，直到找到安装的字体为止。

设置字号

要设置div内的字号，我们可以使用CSS的font-size属性。这个属性用于指定字号的大小。

示例代码：

div {
  font-size: 16px;
}

上述代码将设置div内的文字字号为16像素。

除了像素值，还可以使用其他单位来设置字号，例如em、rem、百分比等。

div {
  font-size: 1.2em;
}

上述代码将设置div内的文字字号为父元素字号的1.2倍。

其他字体属性

除了font-family和font-size属性，还有其他一些与字体相关的CSS属性可以进一步控制字体的显示效果。

• font-weight：设置字体的粗细程度，可以是normal（常规）或bold（粗体）。
• font-style：设置字体的样式，可以是normal（常规）、italic（斜体）或oblique（倾斜）。
• text-decoration：设置字体的装饰效果，例如underline（下划线）和line-through（删除线）。

示例代码：

div {
  font-weight: bold;
  font-style: italic;
  text-decoration: underline;
}

上述代码将设置div内的文字为粗体、斜体，并带有下划线。

总结

通过使用CSS的font-family和font-size属性，我们可以轻松设置div内的字体和字号。除了这两个属性，还可以使用其他字体相关的属性来进一步控制字体的显示效果。在设计和排版网页时，合适的字体和字号选择可以提升用户的阅读体验和页面的美观度。