干货丨速度教你创建网页文件，实现HTML入门

今天，为大家准备了关于创建网页文件的学习内容，具体包括网页文件创建、HTML标签语法规范、HTML标签的关系以及HTML整体结构。

完成以上内容的学习，零基础学习者基本上就能学会如何创建一个有简单内容的网页文件，快一起来看吧！

                                     **HTML入门创建网页文件** 

01.网页文件创建

（1）网页文件的扩展名

在讲解标签的具体语法规范前，我们首先要创建一个网页文件。说到文件，我们知道文件有类型，也就是有扩展名。

例如，记事本文件，它的扩展名为：.txt。那么，网页文件的扩展名是什么呢？网页文件的扩展名为：’.html’ 或者是’.htm’。

所以，看到以’.html’或’.htm’结尾的文件，就应该马上get到一个重要的信息：这是网页文件，可通过浏览器打开对应文件，查看具体的网页内容。

（2）如何创建网页文件

因为一个网站包含众多网页，相对应的是也会有很多的网页文件，所以我们不能随意创建网页文件，这样不利于后期管理。那应该如何做？

在桌面、D盘或E盘(当然，你也可以选择你喜欢的一个盘)中创建一个文件夹，将创建的网页文件都放在该文件夹中统一管理；后期即使文件再多，也能及时找到并易于分类管理。

（3）创建第一个网页文件

Step1：在电脑桌面上新建 一个文件夹，命名为：MyWeb；

Step2：在该文件夹内，创建一个文本文件，即扩展名为’.txt’的文件；文件可随意命名，此处命名为：index.txt；

Step3：修改文本文件的拓展名。网页文件的扩展名为:’.html’或’.htm’，因此，需要将创建的文本文件拓展名改为网页文件的拓展名，即改变其类型。修改完扩展名，文件名前面出现了一个浏览器的图标。显而易见，我们创建的文件就是一个网页文件。

Step4：向网页文件内添加内容。选中‘index.html’文件，右击，在弹出的快捷菜单中，选择‘打开方式’–‘记事本’。打开 ’记事本‘，即可开始在记事本中编写HTML标签。

02.HTML标签语法规范

（1）所有的标签都包含在一对尖括号中，尖括号必须在英文状态下输入；

（2）标签一般情况下都是成对出现，这种情况称为“双标签”；

（3）第一个标签为：开始标签；第二个标签为：结束标签；

（4）必须要有结束标签，结束标签是一个斜杠：“/”。比如：。

（5）当然，在HTML中，也有单个标签的出现，这种情况称为：“单标签”。比如：
。

03.HTML标签的关系

（1）包含关系

所谓的包含关系指：一个标签中再包含另外一个标签，可以理解为标签的嵌套。

举个例子：

上面例子中的

（2）并列关系

标签与标签位置并列，并不是从属关系，像这种情况，我们称之为“并列关系”。可以将这种并列关系理解为“兄弟关系”。

比如：

04.HTML整体结构

每个网页的整体结构基本上一致，也就是说每个网页都会有一个基本的结构标签，也称之为骨架标签，所有的页面内容就是在这些基本标签上进行编写。

我们来看一个网页的整体结构，如下所示：

通过上面的代码，我们可以看到标签是最大的标签，它包含了其他所有的标签，所以也称为：根标签。

标签：是页面的头部标签，代表网页的头部区域；而标签内部包含了一个 标签：表示文档的主体，其包含了文档内所有内容，页面内容基本都置于body标签内，也就是说，页面中显示的内容都需要放在body标签内。

光说不练假把式，大家赶紧自己动手创建一个简单的网页文件吧！图片

当然，创建一个简单的网页文件，只是HTML快速入门的第一步。播妞后续还会更新更多的干货知识，敬请关注哦！

另外，黑马程序员B站 有海量的前端视频课程，免费体验优质学习资源，大家可以在b站搜索自学！