我的第一个HTML

HTML（HyperText Markup Language）是超文本标记语言。通俗地讲，HTML的作用就是给一段文字添加标签，然后浏览器就会知道，这段文字该放在什么位置、是什么样式（不过现在添加样式一般都是用CSS），有什么样的作用等等。可能这么讲还比较抽象，我们来动手试试首先打开马俊老师最爱的笔记本，敲上下面这段东西（先不管它是什么意思）：

然后我们在 和 之间随便打点字:

接着我们保存下这个文本文档，并将后缀改为html：

右键打开方式，选择一个浏览器打开，我们会看到这些内容：

我们随便打的内容显示在了我们平时称为“网页”的东西上。竟然有点小激动。但冷静下来之后我们发现，这个页面好像有点丑。首先，标题和hello world写在了同一行，不是很美观；其次，页面选项卡上的文字是一堆乱七八糟的东西，不太像我们平时打开的网页，比如打开百度后，我们看到的选项卡上的文字是“百度一下，你就知道”：

但我们的网页是这样的：

我们先来解决第一个问题。在“这是一个标题”的两边分别加上 和 ，效果如下:

我们可以发现，不仅标题变大了，而且标题和“hello world”分成了两行显示。据此我们可以推测出，通过添加 和 ，浏览器识别出了标题，将其放大并让标题和其它内容分列在不同的行显示。在HTML中，我们将加尖括号的内容，如 和 ，称为标签。通过对文字添加标签，我们可以给这些文字添加语义，从而在浏览器上显示出不同的内容。例如 和 ，就是给文字添加标题语义的。现在来解决第二个问题。根据上一个问题的解决方案，我们可以很自然地想到添加另外一种标签或许能解决这个问题。事实也的确如此。只不过这个标签比较特别。刚才我们的改动都是在 和 标签之间进行的。因为在 和 标签之间的内容，会被显示“页面”上。但是选项卡的标题并不是在页面上显示的，因此我们把它放在 和 标签之间。在 和 标签之间敲上如下内容:

效果如下：

大功告成！和body标签相对，head标签之间的内容不会显示在页面上。它通常被用来进行设置（如利用title标签更改选项卡的内容），以后学到CSS的时候就会知道页面的样式也是在这里进行设置的。