手把手教你写第一个网页

本文将引导你创建第一个网页，你需要准备好文本编辑器，如记事本（Windows）或TextEdit（Mac），按照HTML规范编写基本结构：包含`、、和标签，在中添加标签以设置网页标题，在中输入文本、图片等元素，保存文件时，选择.html扩展名，如index.html`，通过浏览器打开该文件，你将看到创建的第一个网页。

在数字时代，网页设计已成为展示个人或企业形象的重要方式，如果你对网页设计感兴趣，学习HTML和CSS是入门的不二之选，本文将通过详细的步骤,手把手教你如何使用HTML和CSS创建你的第一个网页。

HTML基础

HTML简介

HTML（HyperText Markup Language）即超文本标记语言，是用来描述网页内容和结构的标记语言，它是互联网的基石之一,与CSS共同构建出丰富多彩的网页世界。

编写第一个HTML页面

在开始编写之前，请确保你有一个文本编辑器（如Notepad++、Sublime Text等）,按照以下步骤操作：

打开文本编辑器,新建一个文件。
将文件另存为“index.html”（确保文件扩展名为.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页面示例。</p>
</body>
</html>

保存文件后，双击它以在浏览器中打开,你应该能看到一个简单的标题和一段文本。

CSS基础

CSS简介

CSS（Cascading Style Sheets）即层叠样式表，用于控制网页的布局和外观，与HTML不同，CSS是一种样式语言,它使用标签来描述页面元素应该如何显示。

为HTML添加CSS

要让HTML页面更具吸引力，我们需要使用CSS为其设置样式,这可以通过以下几种方式实现：

内联样式：直接在HTML元素的标签中添加style属性。
内部样式：在HTML文档的<head>部分使用<style>标签定义CSS规则。
外部样式：将CSS规则保存在单独的文件中，并使用<link>标签引入到HTML文档中。

在本例中，我们将使用内部样式来为我们的网页添加样式，打开你的“index.html”文件，并在<head>部分添加以下CSS代码：

<style>
    body {
        font-family: Arial, sans-serif;
        background-color: #f0f0f0;
    }
    h1 {
        color: #333;
        text-align: center;
    }
    p {
        color: #666;
        font-size: 16px;
    }
</style>