姬小光前端小讲堂【第002期】

在上一期“然并卵的 Hello World ！”（聊天界面回复 001）发出之后，同学们的反应跟我的预期出奇的一致，那就是然！并！卵！

那么从这一期起，让我们接触一些真正的代码吧！

HTML语言与常用标签

与其说HTML（How To Make Love）是一门语言，不如说是一组标记，只要按照特定的格式书写，就可以被你的浏览器识别，并显示出来。

HTML标签的写法也很简单，比如一级标题就是：

<h1>此非然并卵</h1>

其中 h 就是 heading 的意思，相当于 Microsoft Office Word 中的大纲标题。二级标题就是 h2，以此类推。

而段落（paragraph）就是：

<p>小红，你就跟你妈说，今晚在同学家住。</p>

还有神奇的超链接（anchor）：

<a href=“http://diao.it” target=“_blank” title=“Why are you so diao?”>DIAO.IT</a>

其中，写在开始标签中，以空格分隔的部分，称为HTML的属性，它可以定义HTML的一些行为。比如超链接的 href 属性，就代表了这个链接指向的地址，当在网页中点击该链接时，就会跳转到对应的网址。

而 target 属性则代表了指向这个地址的打开方式，_blank 就代表新开一个空白页，即新窗口打开。

下面我们看看，如何把它们组合起来并应用到实际中。

右键点击上一课新建的 index.html，选择“打开方式”，选择“记事本”打开。也可以用记事本新建一个文件。

把刚才的几个标签都贴进去：

然后保存，注意如果是新建文件，要选择另存为，然后键入 index.html。

保存完成后，再次双击 index.html，你可以看到一个设计风格极其简洁的网页诞生了：

你会发现，我们刚才写的标签在浏览器里已经有了一些不一样的样式。比如，h1 的字体会变大变粗，a 的颜色会变成蓝色，并且有下划线，这是因为，你的浏览器会有一些内置的样式，方便你浏览网页。

So，下一节，我们来说说所谓“样式”。