本文将教您如何使用HTML和CSS基础创建一个简单的网页，介绍HTML的基本结构，包括head和body部分，展示如何使用CSS为网页添加样式，包括字体、颜色、背景等，通过一个完整的示例，引导您完成从编写代码到设置样式的全过程，创建一个具有基本功能的网页，通过本文学习，您将掌握网页设计的基本概念，并能够创建自己的网页。
在数字时代,互联网已经成为我们生活中不可或缺的一部分，要与他人分享信息和内容，最基本的方式之一就是创建网页，本文将简要介绍如何使用 HTML 和 CSS 这两种编程语言来构建你的第一个网页。
HTML 简介
HTML 是“超文本标记语言”（HyperText Markup Language）的缩写，它是一种用于创建网页结构的标记语言，与 CSS 一起，HTML 可以让我们控制网页上元素的布局、样式以及文档之间的链接关系，一个典型的 HTML 页面结构包括<!DOCTYPE html>、<html>、<head>、<title>和<body>这几个主要部分。
创建一个简单的 HTML 页面
下面是一个包含 HTML 页面所有基本结构的示例：
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">我的第一个网页</title>
</head>
<body>
<h1>欢迎来到我的网站</h1>
<p>这是一个使用 HTML 和 CSS 创建的简单网页。</p>
</body>
</html>
这个示例展示了一个基本的 HTML 页面结构，并使用了几个常见的 HTML 标签（如<h1>和<p>），保存文件为 index.html 后，你可以在浏览器中打开它，看到页面显示的内容。
CSS 简介
CSS 是“层叠样式表”（Cascading Style Sheets）的缩写，是一种用于描述 HTML 元素在网页上如何呈现的样式语言，CSS 可以让我们轻松地控制元素的颜色、字体、间距、边框等样式属性。
为什么需要 CSS
在早期的网页设计中,HTML 仅负责内容的展示，而网页的外观则通过内联样式或外部样式表来定义，随着网页设计的复杂度增加，手动编写大量的内联样式已经不再现实，CSS 应运而生，它提供了一种更加模块化和可维护的方式来设计网页样式。
编写简单的 CSS 规则
要在网页中使用 CSS，我们需要在<head>部分引入一个<style>标签或在网页的 CSS 文件中定义样式规则，下面是一个简单的 CSS 示例，用于改变段落文字的颜色和字体大小：
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">我的第一个网页</title>
<style>
p {
color: blue;
font-size: 24px;
}
</style>
</head>
<body>
<h1>欢迎来到我的网站</h1>
<p>这是一个使用 HTML 和 CSS 创建的简单网页。</p>
</body>
</html>
在这个示例中,<style>标签内的 CSS 规则指定了所有段落（<p>元素）的颜色为蓝色，字体大小为 24 像素。
HTML 和 CSS 是构建网页的基础技术，通过上述介绍的简单示例，你已经学会了如何创建一个包含标题、段落等基本内容的网页，并为其应用基本的样式，随着学习的深入，你可以尝试使用更复杂的 HTML 结构和 CSS 规则来设计更具吸引力的网页。
记住不要害怕尝试和创新,网页设计是一个不断发展的领域，随着新技术的出现，你的技能和知识也将不断提升。
