标题: 第一章：欢迎来到 HTML 星球！ [打印本页] 作者: 惊落一身雪 时间: 2025-3-13 18:51 标题: 第一章：欢迎来到 HTML 星球！ 第一章：欢迎来到 HTML 星球！
1.1 宇宙的基石：HTML 是什么？
嘿，酷爱的探险家！欢迎踏上这场奥妙的 HTML 星球大冒险之旅！在我们正式踏入这个充满奇幻色彩的星球之前，咱们得先搞清晰，HTML 到底是个啥玩意儿。
想象一下，整个互联网就像是一个浩瀚无垠的宇宙，而网页呢，就是这个宇宙里的各个星球。每个星球都有自己独特的风貌和故事，而 HTML 就是制作这些星球的基石。它就像是宇宙里的乐高积木，咱们可以用各种各样的标签，搭建出统统你能想象到的网页内容。
HTML 全名叫 HyperText Markup Language，中文就是超文本标记语言。超文本？听起来是不是很厉害的样子？实在啊，超文本就是比普通文本更厉害的文本，它不光能包罗笔墨，还能包罗图片、链接、视频等等，就像是一个超等大杂烩。而标记语言呢，就是用一些特定的符号和标签来描述内容的格式和结构。
好比说，咱们在网页上看到的标题、段落、图片，这些都是用 HTML 标签来定义的。就好像是用不同形状的乐高积木，搭出了不同样子的建筑。没有 HTML，网页就只是一片空缺，啥都没有，就像宇宙里没有星星一样暗中和无趣。
现在，让我们来打响这场冒险的第一枪，创建一个最简朴的 HTML 文档。打开你喜欢的文本编辑器，就像拿起了一把神奇的魔法棒，然后输入下面这行神秘的代码：
<!DOCTYPE html>
复制代码
这行代码就像是一个神秘的咒语，它告诉欣赏器：“嘿，我是一个 HTML 文档，你要按照 HTML 的规则来解读我哦！”这可是 HTML 文档的入场券，少了它，欣赏器大概就会一脸懵圈，不知道该怎么处理你的文档了。
1.2 熟悉 HTML 文档的「骨骼结构」
现在，咱们已经拿到了进入 HTML 星球的入场券，接下来就来深入相识一下 HTML 文档的内部结构吧。我把 HTML 文档比喻成一个鲜味的汉堡包，这样你就更轻易明白啦。
包装盒：<html> 标签
首先，咱们有一个大大的包装盒，这个包装盒就是 <html> 标签。它就像是汉堡的包装盒，把整个汉堡包都包在里面。在 HTML 里，<html> 标签是所有内容的根标签，所有其他的标签都要放在它的里面。就像汉堡的各种食材都要放在包装盒里一样。
代码示例如下：
末了，也是最重要的部门，就是汉堡的本体啦，这就是 <body> 标签。汉堡的肉饼、蔬菜、酱料都在这一层，而在 HTML 里，<body> 标签里放的就是网页上所有可见的内容，好比笔墨、图片、按钮等等。
完备的 HTML 文档示例如下：
<!DOCTYPE html>
<html> <head> <title>我超酷的 HTML 汉堡包</title> <meta charset="UTF-8"> </head> <body> <h1>欢迎来到我的 HTML 星球！</h1> <p>在这里，我们将一起探索 HTML 的奥妙世界。</p> </body></html>
复制代码
在这个示例里，<h1> 标签定义了一个一级标题，就像是汉堡里的大肉饼，很显眼。<p> 标签定义了一个段落，就像是汉堡里的蔬菜，起到补充内容的作用。
现在，把这段代码保存为一个 .html 文件，然后用欣赏器打开它。哇塞，你会看到一个有标题和段落的网页出现在面前，就像你亲手做出了一个鲜味的汉堡包一样有成就感！
好了，探险家，第一章的冒险就到这里啦。我们已经相识了 HTML 是什么，还熟悉了 HTML 文档的基本结构。接下来，咱们就要带着这些知识，继续深入 HTML 星球，去探索更多好玩的标签啦！