前端小白要搞懂什么是HTML,看这一篇就够了
本文是《HTML5与CSS3基础语法自学教程》的第一篇,首发于【前端课湛】微信公众号。
导读:本小节主要讲解 HTML 的基本信息,其中包含 HTML 概念、HTML 发展历程和 HTML 标准版本的发展历程。通过本小节的学习可以对 HTML 的含义有个初步的理解,为后续进一步学习 HTML 相关概念打下基础。
1. 什么是 HTML
HTML 是个缩写形式,其全称为 Hyper Text Markup Language,翻译成中文的含义为 超文本标记语言。HTML 不是一门编程语言,而是一门标记语言,因为 HTML 是由一系列的 元素 组成,这些元素可以包含文本、超链接等不同内容。
如下示例代码是展示了基本的 HTML 结构:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>HTML基本结构</title>
</head>
<body>
<h1>这是最基本的HTML结构</h1>
</body>
</html>
提示:上述示例代码的具体含义会在后续章节中进行讲解,这里仅作为展示。
想要对 HTML 的概念进一步了解的话,需要将概念分成 超文本 和 标记语言 两部分进行分别学习。
1.1. 什么是超文本
首先,先来讲一讲有关超文本的含义。HTML 最早是由文本发展而来的,关于文本我们一般是比较熟悉的。例如我们创建一个扩展名为.txt的文件,并编写如下示例内容:
这是一个文本文件。
这样就创建了一个文本文件。现在我们将这个文本文件的扩展名修改为.html或者.htm,这样这个文本文件就变成了一个 HTML 文件。通过浏览器运行是可以显示这个 HTML 文件的内容了,如下图所示:
说明:上述示例中的 HTML 不是标准的 HTML。因为 HTML 的语法是松散型的,所以浏览器是可以正确解析并运行的。
随着 HTML 的发展,到目前为止已经不仅仅是文本内容这么简单,还可以显示图片、链接、音乐,甚至视频等更复杂的内容。
1.2. 什么是标记语言
理解了 超文本 的含义,接下来我们再来看看 标记语言 要如何来理解。首先,我们来看这样的一个描述:
标记语言,是一种将文本以及文本相关的其他信息结合起来,展现出关于文档结构和数据处理细节的电脑文字编码。与文本相关的其他信息(包括例如文本的结构和表示信息等)与原来的文本结合在一起,但是使用标记进行标识。
—— 摘自【百度百科】
百度百科上关于 标记语言 的描述是比较抽象地、比较难懂地。我们可以这样简单地来理解 标记语言 的含义。标记语言 中的 标记 指的就是 HTML 中的元素(Element),而 HTML 就是由这样的一系列元素组成的,所以被称为 标记语言。
如下图所示展示了一个 HTML 元素的结构:
注意:HTML 的元素是给定的。无论是 HTML 元素的数量,还是 HTML 元素的作用都是固定不变的。换句话讲,我们学习 HTML 简单来说就是学习 HTML 元素的含义、作用以及用法等内容。
2. HTML 发展历程
理解了 HTML 的概念之后,我们再来介绍有关 HTML 的发展历程。
提示:这部分内容了解即可,毕竟对我们学习 HTML 本身是没有任何影响的。
早在 1989 年,蒂姆·伯纳斯-李为使世界各地的物理学家能够方便的进行合作研究,创建了使用于其系统的 HTML。蒂姆·伯纳斯-李 设计的 HTML 是以纯文字格式为基础,可以使用任何文本编辑器处理,最初仅有少量标记(TAG)而易于掌握运用。
随着 HTML 使用率的增加,人们不满足只能看到文字。1993 年,还是大学生的 马克·安德生 在他的 Mosaic 浏览器加入 <img> 标记,从此可以在 Web 页面上浏览图片。
但人们认为仅有图片还是不够,希望可将任何形式的媒体加到网页上,因此 HTML 得以不断地扩充和发展。
3. HTML 版本发展历程
自 1993 年之后 HTML 出现真正意义上的第一版,发展到至今,经历了 5 个大版本的更新和迭代。具体每个版本发布的时间如下:
- 超文本标记语言(第一版)—— 在 1993 年 6 月作为互联网工程工作小组(IETF)工作草案发布(并非标准)
- HTML 2.0 —— 1995 年 11 月作为 RFC 1866 发布,在 RFC 2854 于 2000 年 6 月发布之后被宣布已经过时
- HTML 3.2 —— 1997 年 1 月 14 日,W3C 推荐标准
- HTML 4.0 —— 1997 年 12 月 18 日,W3C 推荐标准
- HTML 4.01(微小改进)—— 1999 年 12 月 24 日,W3C 推荐标准
- HTML 5 —— 第一份正式草案已于 2008 年 1 月 22 日公布,正式版本发布于 2014 年 10 月 29 日
名词解释:
- IETF 是简写形式,其全称为 The Internet Engineering Task Force,翻译成中文的含义为 互联网工程工作小组。成立于1985年底,是全球互联网最具权威的技术标准化组织,主要任务是负责互联网相关技术规范的研发和制定,当前绝大多数国际互联网技术标准出自IETF。
- RFC 是简写形式,其全称为 Request For Comments,翻译成中文的含义为 请求评论。 是一系列以编号排定的文件,包含了关于 Internet 的几乎所有重要的文字资料。
- W3C 指 万维网联盟(World Wide Web),1994 年 10 月在麻省理工学院计算机科学实验室由 蒂姆·伯纳斯-李 创建,是 Web 技术领域最具权威和影响力的国际中立性技术标准机构。
在 HTML 版本发展历程中,大部分的版本都离我们远去了,也就是说我们并不关心,而需要关心的是 4.01 和 5 这两个版本。5 版本是 HTML 目前最新版本,也就是我们现在常说的 HTML5,而且现在学习 HTML 都是针对 5 这个版本进行学习的。
反而需要特别关心的是 4.01 版本。因为 4.01 版本依旧存在于一些较老的网站或者系统中,如果将来你的工作是对这些网站或者系统进行升级工作的话,那么就需要了解 4.01 这个版本的内容。
说明:在学习 HTML 的过程中,还需要注意 4.01 版本和 5 版本之间的差异。主要内容就是更新到 5 版本之后,删除了哪些内容,新增了哪些内容等。
4. 总结
本小节从 HTML 的概念开始讲解,然后又讲解了 HTML 的发展历程和 HTML 版本的发展历程等内容。其中:
- HTML 概念,我们分成了 超文本 和 标记语言 两方面进行具体讲解。这是有助于我们理解 HTML 的含义。
- HTML 发展历程,作为了解内容进行介绍。这部分内容知不知道,是不影响我们学习 HTML 具体的语法内容的。
- HTML 版本的发展历程,主要经历了 5 个版本的发展。其中,我们需要关注的是 4.01 和 5 这两个版本的具体内容,这两个版本关系到我们将来的学习和工作。
预告:下一节,我们将通过创建第一个 HTML 页面,来学习 HTML 的基本结构、声明、元素以及注释等内容。
前端小白要搞懂什么是HTML,看这一篇就够了的更多相关文章
- 前端模块化——彻底搞懂AMD、CMD、ESM和CommonJS
我们知道,在NodeJS之前,由于没有过于复杂的开发场景,前端是不存在模块化的,后端才有模块化.NodeJS诞生之后,它使用CommonJS的模块化规范.从此,js模块化开始快速发展. 模块化的开发方 ...
- Java分布式锁,搞懂分布式锁实现看这篇文章就对了
随着微处理机技术的发展,人们只需花几百美元就能买到一个CPU芯片,这个芯片每秒钟执行的指令比80年代最大的大型机的处理机每秒钟所执行的指令还多.如果你愿意付出两倍的价钱,将得到同样的CPU,但它却以更 ...
- Elasticsearch Query DSL 整理总结(二)—— 要搞懂 Match Query,看这篇就够了
目录 引言 构建示例 match operator 参数 analyzer lenient 参数 Fuzziness fuzzniess 参数 什么是模糊搜索? Levenshtein Edit Di ...
- 搞定SEO,看这一篇就够了
一.SEO入门 1.SEO是什么? SEO(Search Engine Optimization)中文意思为搜索引擎优化.在了解搜索引擎自然排名机制的基础上,对网站进行内部及外部的调整优化,改进网站在 ...
- 链表算法题二,还原题目,用debug调试搞懂每一道题
文章简述 大家好,本篇是个人的第4篇文章. 承接第3篇文章<开启算法之路,还原题目,用debug调试搞懂每一道题>,本篇文章继续分享关于链表的算法题目. 本篇文章共有5道题目 一,反转链表 ...
- 新手入门HTML5开发,你必须先搞懂这6个问题
凭借着跨平台,实时更新,无需安装,易于分发等众多优点,HTML5受到越来越多企业的青睐.而凭借着入门相对简单的优势,很多人编程初学者都选择学习HTML5.但对于初学者来说,学习HTML5之前,会有很多 ...
- 来一轮带注释的demo,彻底搞懂javascript中的replace函数
javascript这门语言一直就像一位带着面纱的美女,总是看不清,摸不透,一直专注服务器端,也从来没有特别重视过,直到最近几年,javascript越来越重要,越来越通用.最近和前端走的比较近,借此 ...
- 前端小白想要编写可维护的js
我是一名前端小白,之前没写过多少代码,心里没有代码质量这个概念,人人都说代码是团队的产物,应该将代码写规范,但是我对具体什么样的代码是可维护的是茫然的. 我没写过多少代码,本来好多东西就不咋会,每次给 ...
- 帮你彻底搞懂JS中的prototype、__proto__与constructor(图解)
作为一名前端工程师,必须搞懂JS中的prototype.__proto__与constructor属性,相信很多初学者对这些属性存在许多困惑,容易把它们混淆,本文旨在帮助大家理清它们之间的关系并彻底搞 ...
随机推荐
- Python日志模块logging简介
日志处理是项目的必备功能,配置合理的日志,可以帮助我们了解系统的运行状况.定位位置,辅助数据分析技术,还可以挖掘出一些额外的系统信息. 本文介绍Python内置的日志处理模块logging的常见用法. ...
- nyoj 36-最长公共子序列 (动态规划,DP, LCS)
36-最长公共子序列 内存限制:64MB 时间限制:3000ms Special Judge: No accepted:18 submit:38 题目描述: 咱们就不拐弯抹角了,如题,需要你做的就是写 ...
- nyoj 975-关于521 (EOF)
975-关于521 内存限制:64MB 时间限制:1000ms 特判: No 通过数:5 提交数:46 难度:2 题目描述: Acm队的流年对数学的研究不是很透彻,但是固执的他还是想一头扎进去. 浏览 ...
- Git使用和介绍-基础指令
转载请标明出处:http://blog.csdn.net/shensky711/article/details/52210625 本文出自: [HansChen的博客] 查看已有配置 取消已有的配置 ...
- mysql数据库终端上的增删改查及权限等相关操作
ctrl + c 终止 [linux] service mysql start 启动mysql service mysql stop 停止mysql service mysql restart 重启m ...
- 数据降维-PCA主成分分析
1.什么是PCA? PCA(Principal Component Analysis),即主成分分析方法,是一种使用最广泛的数据降维算法.PCA的主要思想是将n维特征映射到k维上,这k维是全新的正交特 ...
- master节点的部署介绍和前置工作
目录 组件介绍 组件介绍 kubernetes master节点运行组件如下: kube-apiserver.kube-scheduler.kube-controller-manager.kube-n ...
- 面试阿里被“吊打”,一问Spring三不知,半年后二战终拿下offer
Spring框架是一个为Java应用程序的开发提供了综合.广泛的基础性支持的Java平台.Spring帮助开发者解决了开发中基础性的问题,使得开发人员可以专注于应用程序的开发. 近两年来,许多大厂在面 ...
- xmlhttp.readyState的值及解释
xmlhttp.readyState的值及解释: 0:请求未初始化(还没有调用 open()). 1:请求已经建立,但是还没有发送(还没有调用 send()). 2:请求已发送,正在处理中(通常现在可 ...
- Java 中 Snack3的使用
网上看了一篇Java 中 Gson的使用,所以也跟着写篇Java 中 Snack3的使用 JSON 是一种文本形式的数据交换格式,从Ajax的时候开始流行,它比XML更轻量.比二进制容易阅读和编写:解 ...