【H5 前端开发笔记】第 01 期：HTML 基础结构

原创于 2026-02-25 20:22:10 发布 · 319 阅读

9 ·

本内容遵循CC 4.0 BY-SA版权协议

GEO检测

标签

#HTML5 #编程入门 #免费教程 #学习笔记 #前端开发

编程开发文档教程专栏收录该内容

111 篇文章

订阅专栏

🚀 个人主页 极客小俊
✍🏻 作者简介：程序猿、设计师、技术分享
🐋 希望大家多多支持, 我们一起学习和进步！
🏅 欢迎评论 ❤️点赞💬评论 📂收藏 📂加关注

HTML到底是什么?

HTML全称(Hyper Text Markup Language) 意思是: 超文本标记语言,简单的说你可以理解成一种标记语言

它就是网页三大要素中的 结构

HTML通俗的解释

HTML文本是由HTML标签组成的描述性的纯文本，HTML标签可以表示成: 文字，图形、动画、声音、表格、链接等网页的组成部分!

总的来说HTML就是超文本标记语言, <标签名>也就是标记（标签也可以称之为节点）

HTML的构成与作用

HTML的组成：标签、属性、内容构成的这一点要注意

HTML的作用: 就是负责页面中的结构，定义出页面中的各个组成部分,采用纯文本的形式的编写html, 标签来标识出页面中的不同部分,标签中放置的就是显示给用户看到的内容, 如文字图片等等…

HTML超文本与纯文本的区别

纯文本 它只能保存文本内容，也就是说光只能是文字其他什么图片、声音、视频等格式的内容都不能描述

超文本 它不光可以用来表示文字内容，还可以用来表示更多的信息内容,就比如图片、视频、声音等内容都可以描述! 并且通常表示这些内容就要把它们放在标记当中!

HTML超文本的特点

因为HTML比普通的文本文件所表示的功能更多，最常见的表示文本的功能就是超级连接,

它是一种组织信息的方式，通过超级链接方式将文本中的文字、图表与其他信息媒体相关联, 这些被相互关联的信息媒体可能在同一文本中(锚点)，也可能是其他文件，或者是远程某台计算机上的文件!

使用超级连接可以让我们从一个页面跳转到另一个页面, 所以才会把HTML被称为: 超文本!

HTML超文本的查看方式

HTML超文本是使用网页浏览器进行阅读的! 而且是只能使用浏览器进行阅览!

超文本后缀名是html 或 htm , 都可以 htm是因为早期windows只支持三位后缀名的文件

什么是HTML元素标签

HTML中的标记也就是指的标签一个意思! 使用它来描述网页结构

HTML标签（标记）的语法： 标签是由"<"和">"括起来

我们可以把一个完整的标签称为 元素 我们通常都把元素和标签理解成一个意思!

标签分为: 单标签与双标签

双标签结构语法如下:

<标签名> 内容  </标签名>

单标签结构语法如下:

单标签: 也叫自结束标签，官方称为: 空标签 (意味着这种标签没有结束标签)

在 XHTML 中，把结束标签放在开始标签中，也就是 <标签 />这种形式!

<标签名 />

<!--例如-->
<h1> 内容 </h1>
<div> 内容 </div>
<span> 内容 </span>
<!--上面的h1、div、span我们就称之为元素，也可以叫做元素标签都可以-->

一个HTML超文本网页的标准格式

<html>
    <head>
        <title>这是第一个网页</title>
    </head>
    <body>
        <h1>
            Hello world
        </h1>
    </body>
</html>

代码解释:

html 标签是根标签, 整个网页有且只有一对
head 标签是描述网页头部信息的标签， 它这个标签中的内容不会显示在网页上，它的内容是用来给浏览器看的,告诉浏览器这是一个什么类型的网页等
body 标签是网页的主体标签，也就是网页所有的可见内容都放置在这个标签中
h1   标签是用来描述文字的标签，并且让文字用1号字体显示