可以直接打开网站的网页：一窥网页代码的奥秘
在互联网的海洋中，我们每天都在浏览各种网站，从新闻到社交媒体，从购物到娱乐，我们可能会好奇，这些网站是如何构建的呢？代码又是如何工作的呢？今天，我们将一起探索一个简单而又有趣的网页代码世界。
让我们从创建一个小小的网页开始，这个网页将包括一些基本的元素，如标题、段落和链接。
**HTML基础**
HTML，全称HyperText Markup Language，是创建网页的基础语言，一个基本的HTML文档结构如下：
<!DOCTYPE html>
<html>
<head>
<title>我的第一个网页</title>
</head>
<body>
<h1>欢迎来到我的网页</h1>
<p>这是一个段落。</p>
<a href="https://www.example.com">点击这里访问示例网站</a>
</body>
</html>在这个例子中，`` 告诉浏览器我们正在使用的是HTML5，``元素是根元素，它包含了整个网页的内容，``元素中包含了元数据，如文档的标题（会在浏览器的标签页上显示），``元素就是定义了这个标题。
在``元素中，我们添加了一个一级标题（``），一个段落（``）和一个链接（``），链接的`href`属性定义了链接的目标网址。
**CSS进阶**
除了HTML，CSS也是非常重要的网页制作工具，CSS，全称Cascading Style Sheets，用于描述网页的外观和格式，以下是一个简单的CSS示例：
<!DOCTYPE html>
<html>
<head>
<title>我的第一个网页</title>
<style>
body {
background-color: lightblue;
}
h1 {
color: white;
text-align: center;
}
p {
font-family: verdana;
font-size: 20px;
}
a {
color: white;
text-decoration: none;
}
</style>
</head>
<body>
<h1>欢迎来到我的网页</h1>
<p>这是一个段落。</p>
<a href="https://www.example.com">点击这里访问示例网站</a>
</body>
</html>在这个例子中，我们在``标签中定义了CSS规则，我们改变了背景颜色（`background-color`），标题的颜色和对齐方式（`color` 和 `text-align`），段落的字体家族和字体大小（`font-family` 和 `font-size`），以及链接的颜色和装饰（`color` 和 `text-decoration`）。
