在本 HTML 教程中，您将学习如何将 CSS 用于 HTML。我们还将讨论将 CSS 包含到 HTML 中的不同方法。
假设我们使用简单的 HTML 代码开发了网页，并且希望以一种合适的方式呈现内容，同时也要具有视觉吸引力。为了做到这一点，我们可以使用 CSS（层叠样式表）属性来样式化我们的网页。CSS 用于为由 HTML 组件组成的网页添加样式。它描述了网站的外观。为了样式化网页，CSS 提供了各种样式属性，如背景颜色、内边距、外边距、边框颜色等等。每个 CSS 属性都具有由分号（;）分隔的名称-值对。
将 CSS 包含到 HTML 文档中有三种主要方法
内联样式用于通过将 CSS 规则直接插入到开始标签中来实施元素的唯一样式规则。style 属性可用于将其绑定到元素。CSS 属性和值对的序列构成了 style 属性。分号 (;) 分隔每个“属性: 值”对，就像在嵌入式或外部样式表中一样。但是，所有内容都必须在一行中，分号后不能有换行符。
使用内联样式通常被认为是一种不良做法。由于样式规则直接集成到 HTML 元素中，因此呈现会与文档内容混杂在一起，使得更新或维护网站变得困难。
<h1 font-size:30px;">This is a heading</h1>
<p font-size:18px;">This is a paragraph.</p>
<div font-size:18px;">This is some text.</div>
嵌入式或内部样式表不会影响它们所嵌入的文档。<style> 元素用于在 HTML 文档的 head 部分建立嵌入式样式表。在 <head> 部分内，您可以声明任意数量的 <style> 元素。
<head>
<style>
body { background-color: Yellow; }
h1 { color: blue; }
p { color: red; }
</style>
</head>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
当样式应用于大量页面时，外部样式表非常适合。外部样式表是一个单独的文档，其中包含您网站的所有样式规则，并且可以链接到任何 HTML 文档。外部样式表是最具适应性的，因为它们允许您仅通过修改一个文件来更改整个网站的外观。外部样式表可以通过两种方式附加：链接和导入
使用 <link> 元素，可以将外部样式表链接到 HTML 文档。<link> 标签在 <head> 部分中使用。
<head>
<link rel="stylesheet" href="css/style.css">
</head>
加载外部样式表的另一种方法是使用 @import 规则。@import 声明指示浏览器加载和使用外部样式表。它可以通过两种方式使用。最简单的方法是将其包含在 <head> 部分的 <style> 元素中。需要注意的是，其他 CSS 规则仍然可以放在 <style> 元素中。
<style>
@import url("css/style.css");
p {
color: blue;
font-size: 16px;
}
</style>
