css 更改背景颜色

📌 相关文章

📜 css 更改背景颜色 - CSS (1)

📅 最后修改于: 2023-12-03 14:40:21.195000 🧑 作者: Mango

介绍

在网页开发中，我们可以使用 CSS 来主题化我们的网页。其中，更改背景颜色是最基础的一步。此篇文章将向您展示如何使用 CSS 来更改网页的背景颜色。

步骤

1. 准备

在开始编写代码之前，您需要一个文本编辑器和一个支持 HTML 和 CSS 的浏览器。

2. 创建 HTML 文件

首先，您需要创建一个 HTML 文件。在以下示例中，我们创建一个简单的 HTML 文档，其中包含一个 <body> 元素，它将成为我们更改背景颜色的目标。

<!DOCTYPE html>
<html>
<head>
	<title>CSS 更改背景颜色</title>
</head>
<body>
	<h1>欢迎来到我的网站</h1>
	<p>这里是一个示例网站</p>
</body>
</html>

3. 创建 CSS 文件

其次，您需要创建一个 CSS 文件，在其中编写更改背景颜色的代码。在以下示例中，我们创建了一个 styles.css 文件，并在其中编写了更改 <body> 元素背景颜色的代码。

body {
	background-color: yellow;
}

4. 把 CSS 文件链接到 HTML 文件

最后，您需要将创建的 CSS 文件链接到 HTML 文档中。在以下示例中，我们将在 HTML head 部分引入我们的 CSS 文件。

<!DOCTYPE html>
<html>
<head>
	<title>CSS 更改背景颜色</title>
	<link rel="stylesheet" href="styles.css">
</head>
<body>
	<h1>欢迎来到我的网站</h1>
	<p>这里是一个示例网站</p>
</body>
</html>

现在，您可以在浏览器中打开 HTML 文件，并更改 <body> 元素的背景颜色。

结论

这就是如何使用 CSS 来更改网页背景颜色的基础知识。试试自己编写 CSS，更改一些颜色，使您的网页变得更有趣吧！