第一讲 HTML初识
文科编程系列课程-Web开发
第一讲 HTML初识
目录
- 1 标记（Mark）
-
- 1.1 文本中的标点
- 1.2 标点符号的特点
- 1.3 从标点到标签
- 2 HTML
-
- 2.1 HTML的概念
- 2.2 HTML5
- 2.3 HTML实践
- 3 课后作业
1 标记（Mark）
1.1 文本中的标点
中国古代书籍中，一般不加标点符号，而是通过文意、语感、语气助词、语法结构等进行断句。像全国卷高考语文中的文言文题目就涉及到文章的断句。
如今，在现代汉语中，我们有一套完整的标点符号系统。在《中华人民共和国国家标准 标点符号用法》里给出了这样的定义：标点符号是辅助文字记录语言的符号，是书面语的有机组成部分，用来表示语句的停顿、语气以及标示某些成分（主要是词语）的特定性质和作用。
试一试
给这句话加上标点：
今天发了古代汉语这本教材但封面上的代这个字印得不太清楚
答案：今天发了《古代汉语》这本教材，但封面上的“代”这个字印得不太清楚。
这句话里用到了书名号《》、双引号“”、逗号，和句号。，我们首先来看书名号。书名号在《中华人民共和国国家标准 标点符号用法》（以下简称《用法》）中提出的作用就是标示语段中出现的各种作品的名称。也就是说，如果想要告知读者某一个句子成分具有作品名称的含义，我们就可以在它的前后两端分别加上《 》这样的标注，从而赋予它一个新的含义。
我们再来看句号。句号在《用法》中提出的作用是用于句子末尾，表示陈述语气。也就是说，如果要告知读者某一陈述句结束了，则可以使用。这样的标注，来表示句子的界限。
1.2 标点符号的特点
我们根据上一节涉及到的这些标点符号，可以概括出以下特点：
- 标点符号有的是成对搭配出现的，例如书名号
《》和双引号“”；有的是独自出现的，例如逗号，和句号。。 - 标点符号是属于语义层面的标记，有助于我们理解语义，但并不是我们语义加工的对象。
- 标点符号是一套约定俗称的符号系统。
1.3 从标点到标签
标点符号可以完成语义层面的标记，那我们如何在形式层面进行标记呢？也就是说，我们如何标记它的样式呢？具体而言，如果想在一句话中强调一个词，我该如何进行标记呢？
我们以加粗为例，请大家类比标点符号，思考如何在一句话中表示“汉语言”这个词被加粗？
我是一位坚强的汉语言学生。
我们可以模仿标点符号，继续设计一套标记符号系统，用一对特殊的符号例如▶◀来表示内部的词加粗，但如果需要标记下划线呢？标记字的颜色、大小、字体、间距等等呢？如果针对每个需求都设计特定的符号予以表示，那这将是一种非常不经济的方式，这不符合我们使用语言对于便利的追求。
那么拓宽思路，标记不一定只是一个字符，也可以是一些字符的组合，那请大家思考，有没有一种利用现成的材料来轻松地达到我们的目的的方法呢？
我们想到了词语，我们的词语是现成的，那么我们是否可以通过词语来完成标记呢？这是一个好主意。
加粗的英语是strong，我们可以试一下这样标注：
我是坚强的strong汉语言strong的学生。
那如果这句话是英语呢？
I am a strong strong linguistics strong student.
显然，用于标记的词语和句子中本身存在的词语混在一起，难以分辨。
我们需要将用于标记的词语和文中的词语区别开，那么我们可以给用于标记的词语左右加上个尖括号，成为一个标签，来表示这是一个标记，而不是句子中的词语。
那就变成了
I am a strong linguistics student.
那现在从一段标记文本中摘抄出
孤舟蓑笠翁独钓寒江雪
显然，因为这只是一个片段，没有上下文语境，我们无法判断出究竟哪个部分是加粗强调的。因此，我们还需要再此基础上进一步类比标点符号进行改进，将成对儿的标签彼此可以配对。于是，我们在后一个标签加上斜杠/，形成形如<> 的标签对。
即：
我是坚强的汉语言的学生。
2 HTML
2.1 HTML的概念
这样由形如<> 标签组成的语言即为HTML语言。
至此我们就可以针对HTML给出一个定义，HTML全称为Hyper Text Markup Language，即超文本标记语言。所谓的“超”指的是超越普通纯文本的存在形式，即包含诸如视频、图片等多媒体，包含输入框、按钮等控件的文本。标记就指的我们刚刚认识到的标签。
HTML本质上是一个类似于标点符号系统的语言，它通过规范化的标签在纯文本中实现嵌入丰富的内容。
2.2 HTML5
H5是HTML5的简称，是结合了 HTML4.01 的相关标准的革新。HTML5因其轻量，内容丰富，编辑简单的特点被众多新媒体平台关注，成为活动营销、运营涨粉的利器。
2.3 HTML实践
请大家实际操作，动手尝试刚刚学习到的语句。
第一步，打开VSCode，创建HTML文件。
第二步，写入语句。
第三步，打开浏览器，查看运行结果。
3 课后作业
作业内容如下：
- 创建一个HTML，使用本节课涉及到的标签完成对所需强调内容的标注。
- 尝试使用 标签，并自主探究这些标签的作用。
- 自己的疑问和困惑，以及完成作业时遇到的困难。
请将作业HTML语句和运行结果截图等放至word内，并将word文档按文科编程Web-姓名-学号格式命名。
命名示例：文科编程Web-张三-01200600
声明
本讲义仅用于文科编程教学，是针对于文科生编程学习的定制化讲授模式，其中个别概念的阐释及举例或与计算机专业领域有些微出入，还请各位大咖包涵！
本人资历尚浅，欢迎各位博主批评指正！