引入 CSS

在 HTML 中，CSS（层叠样式表） 用于控制网页的外观与布局。我们可以通过多种方式将 CSS 应用于 HTML 页面，实现更丰富的样式效果。

三种引入方式

将样式直接写在标签内的 style 属性中。适合局部简单样式。

html

<p style="color: red; font-size: 16px;">这是一段红色文字</p>

将 CSS 写在 HTML 文件 <head> 区域的 <style> 标签内，适用于单页面项目。

html

<head>
  <style>
    p {
      color: blue;
      font-size: 18px;
    }
  </style>
</head>

将 CSS 单独写在 .css 文件中，并通过 <link> 标签引入。推荐使用此方式，便于样式复用与维护。

html

<head>
  <link rel="stylesheet" href="style.css" />
</head>

style.css 示例：

css

body {
  background-color: #f9f9f9;
  font-family: Arial, sans-serif;
}

通过引入 CSS，网页不仅结构清晰，还能拥有良好的视觉体验，是前端开发的重要组成部分。