当前位置：首页 > news >正文

【HTML入门】第一课 - 网页标签框架

news 2026/5/26 17:32:25

这一节，我们说一下学习前端开发的话，最入门的也是非常重要的一门可成，也就是HTML。HTML标签，是网页的重要组成部分，可以说，你看到网页上的内容，都是基于HTML标签呈现出来的。

这一小节呢，我们说一下，HTML最初的，刚一新建网页，就应该写的框架标签们。

1 新建HTML文档

1.1 新建一个txt文档

1.2 修改文档后缀

1.3 打开这个HTML文件

2 HTML的标签框架

2.1 DOCTYPE标签

2.2 html标签

2.3 head标签

2.4 body标签

3 小结

1 新建HTML文档

可能你发现，你新拿到的电脑呢，并不能新建HTML文档，所以可以新建一个txt文档，首先新建一个文件夹，用于我们这个系列课程的学习内容。

1.1 新建一个txt文档

首先呢，新建一个txt文档，鼠标 “右键”，点击“新建”，然后点击“文本文档”，新建以后是这样子的：

1.2 修改文档后缀

什么是“文档”呢，你新建这个就是所谓的人们称之为的文档，也可以叫文件，总之都是一个东西。

你看他叫 “新建文本文档.txt”，这个 .txt 呢就是这个文档的后缀，你可以把 txt 改为 html，这样，我们就是新建了一个HTML文档了。

1.3 打开这个HTML文件

这个时候呢，你可以鼠标双击打开这个HTML文档，这个HTML文档就会被浏览器打开了。当然，推荐使用Chrome浏览器，不过你如果电脑上有Edge浏览器呢，也可以，其他浏览器也没有关系。

打开以后是这样子的，就是一个空白的网页

2 HTML的标签框架

我们做前端开发，总是要在浏览器这个容器里浏览网页内容的。而网页内容呢，又是包含在HTML这些框架标签里的。这里说一下这些标签框架。

2.1 DOCTYPE标签

网页文档的第一行呢，我们加DOCTYPE标签，他会告诉浏览器，我们要以哪种文档格式来渲染网页。我们先来学习具体的知识，如果想学习更详细的，更扩展的内容呢，记得私信告诉狗哥，我给你找相关内容来学习。

<!DOCTYPE html>

这就是网页的第一行代码。

2.2 html标签

我们所有的网页内容呢，都是嵌套在这个html标签里的。所以，html 是一种文档格式，也是前端网页的一个标签。这个html标签呢，是一个成对出现的，意思就是需要写一个开始的，一个结束的标签。就像这样：

<html></html>

2.3 head标签

网页呢，也分头部和身体，所以，这里需要加head标签，head标签呢，放一些浏览器需要的，但是缺不展示的内容，比如渲染一些样式啦（我们后面说）。

<!DOCTYPE html>
<html><head></head>
</html>

2.4 body标签

刚才说到网页有身体标签，就是这个body标签，所有需要展示出的，需要被人们看到的网页内容，都会添加到这个body标签内。

<!DOCTYPE html>
<html><head></head><body></body>
</html>

3 小结

好啦，这一小节呢，我们先学到这里，很简单，就是一个非常入门的内容，虽然入门，但这是网页开发的最基本，最基本的内容，一旦你做了前端开发，这个东西是永远都脱离不开的，不管你做了多么高深的网页内容，不管你去了哪个大公司，网页永远脱离不开这个基本框架要素。

如果你真的是在跟着狗哥学习，点个赞，关注狗哥，告诉狗哥，一起学起来。

1 新建HTML文档

1.1 新建一个txt文档

1.2 修改文档后缀

1.3 打开这个HTML文件

2 HTML的标签框架

2.1 DOCTYPE标签

2.2 html标签

2.3 head标签

2.4 body标签

3 小结

相关文章：