HTML5基础——2、H5的基本介绍

原创已于 2025-10-18 07:52:32 修改 · 998 阅读

16 ·

CC 4.0 BY-SA版权

文章标签：

#html5 #前端 #html

于 2025-10-13 15:00:00 首次发布

H5 专栏收录该内容

46 篇文章

订阅专栏

大家好，我是阿赵。接下来一起学习一下H5网页制作。
上一篇介绍了用VSCode来编写HTML文件。也简单的制作了一个网页。接下来才回头说一下，什么是H5。

一、 H5是什么

之前写的HTML文件，很明显就是一个网页文件了。我们使用网页浏览器打开一个HTML文件，就能浏览一个网页的内容。
写HTML文件的语言，就是叫做HTML语言。而我们经常说的H5，全称是HTML5，顾名思义，H5本质上还是HTML语言，只是它是第五代的HTML。
简单的理解，H5比起最初的HTML1.0-HTML4.0，提供了更多的视频、音频、图像、动画已经设备交互等的支持，拥有更强大的功能。

二、 HTML语言的特点

由于H5就是HTML，所以学习H5要从基础的HTML开始。
HTML的全称为超文本标记语言(Hyper Text Markup Language)，是一种标记语言。
所谓的标记语言，简单说，里面是由“标签”作为单位去组织的。
比如上一篇里面的最基础的HTML模版：

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <h1>Test H5</h1>
  <p>This is a simple HTML.</p>
</body>

</html>

整个文件里面都是由很多个尖括号组成的，比如

<html></html>、<head></head>

这些就是标签。
但这个网页看起来和我们平常看到的网页好像有点区别，首先很难看，布局单一，没有丰富的图片和绚丽的动画，然后没有功能性，只是显示几个文字。
这是因为，一个完整的HTML文件，应该是由三部分组成的：

1、结构

HTML里面的标签起到的作用是规定结构。以盖房子来举例，HTML里面的标签就像房子的框架结构，当搭好了之后，房子就可以整体成型了。
但这时候房子只有一个框架，没有装修，也没有功能，基本上是不能住人的。

2、表现

在HTML里面，我们除了用标签来写框架外，还需要指定风格(style)。通过给标签指定各种风格，可以让网页变得更丰富好看。以盖房子来举例，风格就像给房子装修，经过装修后的房子，会变得好看。
在HTML里面，给标签指定风格，是通过CSS来指定的。CSS是什么，以后详细学习，先简单理解，CSS就是控制网页外观好看的。
有了装修之后，房子像模像样了。但这时候房子只能看，没有功能性。比如没有通水电，没有家电，生活不便利。

3、行为

我们经常上各种网站，可以知道网页不仅是为了看的，还有很多功能性。比如百度可以搜索咨询，携程网可以订机票酒店，地图网站可以查询地址和路线，等等。
这些功能，我们可以成为行为。通过给网页添加行为，可以让网页实现各种的功能。
在HTML里面，现在比较流行实用JavaScript来实现功能。
到了这时候，房子盖好了，有框架，有装修，有功能。