Hyper Text Markup Language超文本标记语言

1. 认识网页

1.1. 网页由哪些部分组成

文字，图片，音频，视频，超链接

1.2. 网页背后的本质

前端程序员所写的代码

1.3. 代码通过什么软件转换成网页

浏览器将代码解析和渲染成用户看到的网页

2. 五大浏览器和渲染引擎

2.1. 浏览器

浏览器是网页显示，运行的平台，是前端开发必备利器

常见的五大浏览器：

IE
火狐(Firefox)
谷歌(Chrome)
Safari
欧朋(Opera)

2.2. 渲染引擎

渲染引擎是浏览器中专门对代码进行解析渲染的部分。

不同公司的浏览器，内在的渲染引擎是不同的

浏览器	内核	备注
IE	Trident	IE，猎豹安全，360极速浏览器，百度浏览器
FireFox	Gecko	火狐浏览器
Safari	Webkit	苹果浏览器
Chrome、Opera	Blink	Webkit分支

⚠️注意：

渲染引擎不同导致解析相同代码的速度，性能，效果不同
谷歌浏览器的渲染引擎速度快，性能高，效果好，更吸引用户

3. Web标准

3.1. 为什么需要Web标准

让不同的浏览器按照相同的标准显示结果，让展示的效果统一

3.2. Web标准构成

构成	语言	说明
结构	HTML	页面元素和内容
表现	CSS	网页元素的外观和位置等页面样式
行为	JavaScript	网页模型的定义和页面交互

4. HTML概念

Hyper Text Markup Language 超文本标记语言

4.1. HTML介绍

专门用于网页开发的语言，主要通过HTML标签对网页中的文本，图片，音频，视频等内容进行描述

4.2. HTML页面固定结构

网页类似于一篇文章：

每一页文章内容是有固定的结构的，如：开头，正文，落款等
网页中也是存在固定的结构的，如：整体，头部，标题，主体

网页中的固定结构是要通过特定的HTML标签进行描述

<html>
  <head>
    <title>网页标题</title>
  </head>
  <body>
    网页的主体内容
  </body>
</html>

5. 语法规范

5.1. 注释

为代码添加的具有解释性，描述性的信息，主要用来帮助开发人员理解代码
浏览器执行代码时会自动忽略所有的注释

5.2. HTML标签的结构

1	<开始标签> 包裹的内容 </结束标签>

标签由<，>，/，英文单词或字母组成，并且把标签中<>包括起来的英文单词或字母称为标签名
常见标签由两部分组成 - 双标签，标签之间包裹内容
少数标签由一部分组成 - 单标签，自成一体，无法包裹内容

5.3. HTML标签的属性

1	<开始标签属性名="属性值"> 包裹的内容 </结束标签>

如 class="oneclass"

标签的属性写在 开始标签内部

标签上可以同时存在多个属性

属性之间以空格隔开

标签名与属性之间 必须以空格隔开

属性之间没有顺序之分

5.4. HTML标签与标签之间的关系

5.4.1. 父子(嵌套)

1
2
3

<head>
  <title></title>
</head>

5.4.2. 兄弟(并列)

1 2	<head></head> <body></body>

6. <html> 根元素

作为网页的根元素

1	<!doctype html>

放到第一行，告诉浏览器用标准，兼容的方式去渲染这个HTML页面。

<!doctype html>
<html>
	<head></head>
	<body></body>
</html>

常常添加属性lang 表示网页的语言声明，使得页面对于搜索引擎和浏览器更加友好。

常见语言：zh-CN/en

1
2
3

<html lang="zh-CN">
  
</html>

语言代码国际标准是IETF的BCP 47。

7. <head>文档元数据

包含了对HTML5页面各种属性，配置信息的描述，代码不会作为页面内容呈现给浏览器。head元素是HTML文档所有元数据的集合之处

7.1. <title>

页面的标题，显示在浏览器标题栏或是收藏夹，历史浏览记录等位置

7.2. <link>

link元素定义文档与外部资源的关系

7.2.1. 外部css，js文件

用来引入css，js，图标等文件。

<!-- css -->
<link ref="css.css" rel="stylesheet">
<!-- ico图标 -->
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
<!-- RSS订阅 -->
<link rel="alternate" type="application/rss+xml" title="BLOG" href="rss.xml">

7.2.2. media属性

1	<link href="css.css" rel="stylesheet" media="screen and (max-width:600px)">

screen 代表媒体类型为电脑或移动终端显示屏幕

all 所有媒体

print 印刷媒体

tv 电视媒体

and 相当于 &&

max-width:600px 代表媒体的最大宽度为600像素

当屏幕宽度小于等于600像素时，应用本条样式

<!-- 当屏幕宽度大于等于400像素时，应用本条样式 -->
<link href="css.css" rel="stylesheet" media="screen and (min-width:400px)">

<!-- 当屏幕宽度大于等于400像素,小于等于600像素时，应用本条样式 -->
<link href="css.css" rel="stylesheet" media="screen and (min-width:400px) and (max-width:600px)">

<!-- 当所有设备宽度小于等于400像素时，应用本条样式 -->
<link href="css.css" rel="stylesheet" media="all and (max-device-width:400px)">

<!-- 当所有设备竖屏显示时，应用本条样式 -->
<link href="css.css" rel="stylesheet" media="all and (orientation:portrait)">

<!-- 当所有设备横屏显示时，应用本条样式 -->
<link href="css.css" rel="stylesheet" media="all and (orientation:landscape)">

使得在使用ios设备从主屏直接启动某个页面时，显示一副启动图像

1	<link rel="apple-touch-startup-image" href="default.png" />

7.3. <base>

标记文档的基础URL地址，“https://www.xxx.com/html5/” 设为页面基准URL，当页面中存在a.html连接时，该连接的地址实际上就是“https://www.xxx.com/html5/a.html”，设置全局浏览器打开方式target=“_black”，设置页面中所有连接均在新窗口打开。

1	<base href="https://www.xxx.com/html5/" target="_black">

7.4. <meta>

7.4.1. 字符编码

<meta charset="UTF-8>" 标识网页只用的字符编码

作用：保存和打开的字符编码需要统一设置，否则可能会出现乱码
常见字符编码
- UTF-8：万国码，国际化的字符编码，收录了全球语言的文字
- GB2312：6000+汉字
- GBK：20000+汉字
注意点：开发中统一使用UTF-8

7.4.2. 元数据名称 name

1	<meta name="renderer" content="webkit">

内核控制标签，content取值为webkit(极速核)，ie-comp(IE兼容内核)，ie-stand(IE标准内核)

页面关键字

1	<meta name="keywords" content="HTML5 前端">

描述内容

1	<meta name="description" content="这是一张HTML5前端页面">

控制搜索引擎抓取行为

1	<meta name="robots" content="none">

none代表页面文件不被检索，页面上的链接不可以被查询。

all表示文件和链接都能够被检索和查询。

数字避免显示为拨号超链接

1	<meta name="format-detection" content="telephone=no">

邮箱避免显示为地址超链接

1	<meta name="format-detection" content="email=no">

页面针对老式手持设备优化

1	<meta name="HandeldFriendly" content="true">

移动设备完整显示网页，自动加一缩放以适应屏幕宽度

<!-- 
    width=device-width 显示窗口宽度等于设备宽度
    initial-scale=1.0 窗口默认不缩放
    user-scalable=no 用户不可缩放
    maximum-scale=1.0 最大缩放值
-->
<meta name="viewport" content="width=device-width,initial-scale=1.0,
        user-scalable=no,maximum-scale=1.0">

当站点还有配􏿇套的Apple Store App时，还可以通过􏺁加以下名为“Smart App Banners”的meta标􏱏，将应用􏵏接􏺫示在页面顶部，以方便用户下载使用

1	<meta name="apple-itunes-app" content="app-id=570931840"/>

7.4.3. 编译指令 http-equiv

1 2	<!-- 要求当前网页使用IE浏览器最高版本的内核来渲染 --> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

每过一段时间刷新

1	<meta http-equiv="refresh" content="300">

页面在规定时间以后，页面加载的同时立刻跳转到其他主页

1	<meta http-equiv="refresh" content="30;URL=http://www.baidu.com">

8. <body>

包含了所有呈现给浏览者的内容信息

8.1. 排版标签

8.1.1. 标题标签<h#>

特点：

文字都有加粗
文字都有变大，但按层次 <h1><h6> ，字号逐层递减
元素都是独占一行的

⚠️ h1标签对于网页尤为重要，开发中有特定的使用场景，如：新闻的标题，网页的logo等

<body>
		<h1>1</h1>
    <h2>2</h2>
    <h3>3</h3>
    <h4>4</h4>
    <h5>5</h5>
    <h6>6</h6>
</body>

8.1.2. 段落标签<p>

在新闻和文章的页面中，用于分段显示

特点：

段落之间存在间隙
独占一行

1
2
3

<body>
	<p> HTML5 </p>
</body>

8.1.3. 换行标签 <br>

让文字强制换行显示

特点：

单标签
让文字强制换行

1
2
3

<body>
	<br>
</body>

8.1.4. 水平线标签 <hr>

分割不同主体内容的水平线

特点：

单标签
在页面中显示一条水平线

1
2
3

<body>
	<hr>
</body>

8.2. 文本格式化标签

需要让文字加粗，下划线，倾斜，删除等效果

标签	说明	标签
b	加粗	strong
u	下划线	ins
i	倾斜	em
s	删除线	del

⚠️ 突出重要性的强调语境，推荐使用右边 strong,ins,em,del

对人：好记忆

对机器：有利于及其解析，对搜索引擎有帮助

8.3. 媒体标签

8.3.1. 图片标签

在网页中显示图片

特点：

单标签
img标签需要展示对应的效果，需要借助标签的属性进行设置

1	<img src="资源路径" alt="替换文本" title="提示文本" width="宽度" height="高度">

alt ：图片加载失败时，才会显示alt的文本

title ：当鼠标悬停时，才显示title的文本

width，height：如果只设置width或height中的一个，另一个没设置的会自动等比例缩放，图片不会变形；同时设置时，可能导致图片变形

8.3.2. 路径

绝对路径 ：目录下的绝对位置，可直接到达目标位置，通常从盘符开始的路径

相对路径 ：从当前文件开始出发找目标文件的过程

同级目录：两者在同一个文件夹中

1 2	<img src="目标图片"> <img src="./目标图片">

下级目录：

1	<img src="./下级文件夹名/目标图片">

上级目录

1	<img src="../上级文件夹名/目标图片">

8.3.3. 音频标签 <audio>

1	<audio src="音频路径" controls autoplay loop></audio>

controls - 显示播放控件

autoplay - 自动播放

loop - 循环播放

⚠️ 不同浏览器实现效果不同

⚠️ 音频标签目前支持三种格式：mp3，wav，ogg

格式	IE9	Firefox3.5	Opera10.5	Chrome3.0	Safari3.0
Ogg Vorbis		√	√	√
MP3	√			√	√
Wav		√	√		√

准备多个格式适配不同浏览器

<audio>
	<source src="xx.mp3" type="audio/mp3">
  <source src="xx.ogg" type="audio/mpeg">
  该浏览器不支持audio播放
</audio>

8.3.4. 视频标签 <video>

1	<video src="视频路径" controls autoplay muted loop></video>

controls - 显示播放控件

autoplay - 自动播放(谷歌浏览器中需配合muted实现静音播放)

loop - 循环播放

属性

属性	值	描述
autoplay	autoplay	视频自动播放
controls	controls	显示控件
width	数字+px	设置播放器宽度
height	数字+px	设置播放器高度
loop	loop	循环播放
preload	proload	加载完再播放
rc	url	视频url
poster	imgurl	加载等待的画面图片
muted	muted	静音播放

⚠️ 视频标签目前支持三种格式：mp3，webm，ogg

格式	IE	Firefox	Opera	Chrome	Safari
Ogg	No	3.5+	10.5+	5.0+	No
MPEG4	9.0+	No	No	5.0+	3.0+
WebM	No	4.0+	10.6+	6.0+	No

准备多个格式适配不同浏览器

<video>
	<source src="xx.mp4" type="audio/mp3">
  <source src="xx.ogg" type="audio/ogg">
  该浏览器不支持audio播放
</video>

8.4. 链接标签 <a>

链接标签

跳转的URL可以用href属性来指定

默认链接带有下划线，字体为蓝色，访问过链接后，文字显示为紫色，清除浏览器历史记录恢复蓝色

1
2
3

<body>
	<a href="https://www.baidu.com" target="网页打开形式"> 百度一下 </a>
</body>

target 可取值：

_self 默认值，在当前窗口中跳转
_blank 在新窗口中跳转

空链接

1	<a href="#"></a>

点击回到网页顶部

开发中不确定链接最终跳转位置时，可以用空链接占个位置

8.5. 列表标签

场景：在网页中按照行展示关联性的内容。如：新闻列表，排行榜，账单等。
特点：按照行的方式，整齐显示内容
种类：无序列表(新闻列表)，有序列表(排行榜)，自定义列表(网页底部信息)

8.5.1. 无序列表 <ul> <li>

场景：在网页中表示一组无顺序之分的列表，如：新闻列表
标签组成：

标签名	说明
ul	表示无序列表的整体，用于包裹li标签
li	表示无序列表的每一项，用于包含每一行的内容

显示特点：

列表的每一项前默认显示圆点标识
注意点：

ul标签中只允许包含li标签

li标签可以包含任意内容

<ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
</ul>

8.5.2. 有序列表 <ol> <li>

场景：在网页中表示一组有顺序之分的列表，如：排行榜
标签组成：

标签名	说明
ul	表示有序列表的整体，用于包裹li标签
li	表示有序列表的每一项，用于包含每一行的内容

显示特点：

列表的每一项前默认显示序号标识
注意点：

ol标签中只允许包含li标签

li标签可以包含任意内容

<ol>
    <li>1</li>
    <li>2</li>
    <li>3</li>
</ol>

8.5.3. 自定义列表 <dl> <dd> <dt>

场景：在网页的底部导航中通常会使用自定义列表实现
标签组成：

标签名	说明
dl	表示自定义列表的整体，用于包裹dt/dd标签
dt	表示自定义列表的主题
dd	表示自定义列表的针对主题的每一行内容

显示特点：

列表的每一项前默认显示缩进效果
注意点：

dl标签中只允许包含dt/dd标签

dt/dd标签可以包含任意内容

<dl>
  <dt>列表1</dt>
  	<dd>内容1</dd>
  	<dd>内容2</dd>
  <dt>列表2</dt>
  	<dd>内容1</dd>
  	<dd>内容2</dd>
</dl>

8.6. 表格标签 <table>

场景：在网页中以行+列的单元格的方式整齐展示和数据，如：学生成绩表
标签组成：

标签名	说明
table	表格整体，可用于包裹多个tr
tr	表格每行，可用于包裹td
td	表格单元格，可用于包裹内容

注意点：

标签嵌套关系：table > tr > td

<table>
  <tr>
    <td>单元格1</td>
    <td>单元格2</td>
  </tr>
</table>

8.6.1. 表格相关属性

场景：设置表格基本展示效果
常见相关属性：

属性名	属性值	效果
border	数字	边框宽度
width	数字	表格宽度
height	数字	表格高度

注意点：

实际开发时针对于样式效果推荐使用css设置

8.6.2. 表格标题和表头单元格标签

场景：在表格中表示整体大标题和一列小标题
标签组成：

标签名	说明
captain	表示表格整体大标题，默认在表格整体顶部居中位置显示
th	表示一列小标题，通常用于表格第一行，默认内部文字加粗并居中显示

注意点：

captain标签书写在table标签内部

th标签书写在rt标签内部

<table>
  <caption>标题</caption>
  <tr>
    <th>列1</th>
    <th>列2</th>
  </tr>
  <tr>
    <td>单元格1</td>
    <td>单元格2</td>
  </tr>
</table>

8.6.3. 表格的结构标签

场景：让表格的内容结构分组，突出表格的不同部分(头部，主题，底部)，让语义更加清晰
结构标签：

标签名	说明
thead	表格头部
tbody	表格主体
tfoot	表格底部

注意点：

表格结构标签背部用于包裹tr标签

表格的结构标签可以省略

<table>
  <caption>标题</caption>
  <thead>
    <tr>
    	<th>列1</th>
    	<th>列2</th>
  	</tr>
  </thead>
  <tbody>
    <tr>
      <td>单元格1</td>
      <td>单元格2</td>
    </tr>
  </tbody>
	<tfoot>
    <tr>
      <td>单元格1</td>
      <td>单元格2</td>
    </tr>
  </tfoot>
</table>

8.6.4. 合并单元格

场景：将水平或垂直多个单元格合并成一个单元格
合并单元格步骤：
1. 明确合并哪些单元格
2. 通过左上原则，确定保留谁删除谁
  - 上下合并 -> 只保留最上的，删除其他
  - 左右合并 -> 只保留最左的，删除其他
3. 给保留的单元格设置：跨行，跨列合并
  
  属性名属性值说明
  
  rowspan 合并单元格的个数跨行合并，将多行的单元格垂直合并
  
  colspan 合并单元格的个数跨列合并，将多列的单元格水平合并
注意点：只有同一个结构标签中的单元格才能合并，不能跨结构标签合并，不能跨thead，tbody，tfoot

<table>
  <caption>标题</caption>
  <thead>
    <tr>
    	<th>列1</th>
    	<th>列2</th>
  	</tr>
  </thead>
  <tbody>
    <tr>
      <td>单元格1</td>
      <!-- 合并单元格2,4 -->
      <td rowspan="2">单元格2</td>
    </tr>
    <tr>
      <td>单元格3</td>
      <!-- <td>单元格4</td> -->
    </tr>
  </tbody>
	<tfoot>
    <tr>
      <!-- 合并单元格5,6 -->
      <td colspan="2">单元格5</td>
      <!-- <td>单元格6</td> -->
    </tr>
  </tfoot>
</table>

8.7. 表单标签 <form>

能够使用表单相关标签和属性，实现网页中表单类网页结构搭建

<form method="post" action="server.php">
  <p>
    <label>输入框</label>
    <input name="username" type="text" placeholder="请输入您的姓名">
  </p>
</form>

8.7.1. action

规定当提交表单时，向何处发送表单数据

值应该是后端提供的一个url地址，这个地址专门负责接收表单提交过来的数据

当未指定这个数值时，表单提交的默认动作是提交给当前页面url地址

8.7.2. target

规定何处打开提交的url

默认是在同一个窗口下

值	描述
_blank	在新窗口中打开
_self	默认。在相同框架中打开
_parent	在父框架集中打开
_top	在整个窗口中打开
framename	在指定的框架中打开

8.7.3. method

表单提交方式：get/post

默认是get，通过url地址+参数的形式提交给服务器

8.7.4. enctype

规定发送表单数据之前如何对数据进行编码

默认情况下值为 application/x-www-form-urlencoded，表示在发送前编码所有的字符

文件上传时，必须将值设置为 multipart/form-data

8.7.5. <input>系列

8.7.5.1. 文本框 text

type=”text”

1	<input type="text" name="name" value="123">

常用属性：

属性名	说明
placeholder	占位符。提示用户输入内容的文本
value	用户输入的内容，提交之后会发送给后端服务器
name	当前控件的含义，提交之后可以告诉后端发送过去的数据的含义，如：name=123
	表单拥有该属性表示其内容不能为空，必填
autofocus	自动聚焦属性，页面加载完成自动聚焦到指定表单
utocomplete	当用户在字段开始键入时，浏览器基于之前键入过的值，应该显示出在字段中填写的选项。默认已经打开，autocomplete=”on”。关闭，autocomplete=”off”。需要放在表单内同时加上name属性，同时成功提交
multiple	可以多选文件提交

8.7.5.2. 密码框 password

type=”password”

1	<input type="password" name="name" value="123">

8.7.5.3. 单选框 radio

type=”radio”

1
2
3

<input type="radio" name="sex" value="male" checked> 男

<input type="radio" name="sex" value="female"> 女

常用属性：

属性名	说明
name	分组。有相同name属性值的单选框为一组，一组中同时只能有一个被选中
checked	默认选中

注意点：

name属性对于单选框有分组功能
有相同name属性值的单选框为一组，一组中只能同时有一个被选中

8.7.5.4. 复选框 checkbox

在网页中显示多选多的多选表单控件

type=”checkbox”

1	<input type="checkbox" name="rule">

常用属性：

属性名	说明
checked	默认选中

8.7.5.5. 文件选择 file

type=”file”

1	<input type="file" name="file">

常用属性：

属性名	说明
multiple	多文件选择

8.7.5.6. 不同功能的按钮

type属性值：

标签名	type属性值	说明
input	submit	提交按钮，点击之后提交数据给后端服务器
input	reset	重置按钮。点击之后恢复表单默认值
input	button	普通按钮。默认无功能，之后配合js添加功能

注意点：

如果需要实现以上按钮功能，需要配合form标签使用
form使用方法：用form标签把表单标签一起包裹起来即可

<form>
  <!-- 提交按钮 -->
  <input type="sumbit">
  <!-- 重置按钮 -->
  <input type="reset">
  <!-- 普通按钮 -->
  <input type="button" value="普通按钮">
</form>

8.7.5.7. 邮箱 email

限制用户输入必须为email类型

1	<input type="email" name="">

8.7.5.8. 网址 url

限制用户输入必须为url格式

1	<input type="url" name="">

8.7.5.9. 时间 time

限制用户输入必须为时间类型

1	<input type="time" name="">

8.7.5.10. 月 month

限制用户输入必须为月类型

1	<input type="month" name="">

8.7.5.11. 周 week

限制用户输入必须为周类型

1	<input type="week" name="">

8.7.5.12. 日期 date

type=”date”

1	<input type="date" name="date">生日

8.7.5.13. 数字 number

限制用户输入必须为数字类型，但不限制 e - 代表科学计数法

1	<input type="number" name="">

8.7.5.14. 手机号码 tel

手机号码

1	<input type="tel" name="">

8.7.5.15. 搜索框 search

键入文字后搜索框内会出现×号可用于清除当前键入的文字

1	<input type="search" name="">

8.7.5.16. 颜色选择表单 color

生成一个颜色选择表单

1	<input type="color" name="">

8.7.6. 按钮标签 <button>

场景：在网页中显示用户点击的按钮

type属性值(同input的按钮系列)：

标签名	type属性值	说明
button	submit	提交按钮。点击之后提交数据给后端服务器
button	reset	重置按钮。点击之后恢复表单默认值
button	button	普通按钮。默认无功能，之后配合js添加功能

注意点：

chrome中button默认是提交按钮

button标签是双标签，更便于包裹其他内容：文字，图片等

1	<button>提交表单</button>

8.7.7. 下拉菜单<select>

场景：在网页中提供多个选择项的下拉菜单表单控件
标签组成：
- select标签：下拉菜单的整体
- option标签：下拉菜单的每一项
常见属性：

selected：下拉菜单的默认选中

<select name="equipment">
  <option value="1" selected>1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
</select>

8.7.8. 文本域<textarea>

场景：在网页中提供可输入多行文本的表单控件
常见属性：
- cols：规定了文本域内可见宽度
- rows：规定了文本域内可见行数
注意点：
- 右下角可以拖拽改变大小
- 实际开发时针对样式效果推荐用css设置

1	<textarea name="text" cols="10" rows="10"></textarea>

8.7.9. <label>

场景：常用于绑定内容与表单标签的关系
使用方法①：
1. 使用label标签把内容包裹起来
2. 在表单标签上添加id属性
3. 在label标签的for属性中设置对应的id属性值
  1
  <input type="checkbox" id="one"><label for="one">文本</label>
使用方法②：
1. 直接使用label标签把内容和表单标签一起包裹起来
2. 需要把label标签的for属性删除
  1
  2
  3
  <label>
  <input type="checkbox">文本
  </label>

8.8. 语义化标签

8.8.1. 无语义的布局标签

场景：实际开发网页时会大量频繁的使用到div和span标签
div标签独占一行
1
<div id="container"></div>
span标签一行可以显示多个
1
<span></span>

8.8.2. 有语义的布局标签

在HTML5新版本中，推出了一些有语义的布局标签

标签名	语义
header	网页头部
nav	网页导航
footer	网页底部
aside	网页侧边栏
section	网页区块
article	网页文章

注意点：

以上标签显示特点和div一致，但是比div多了不同的语义

8.9. 字符实体

场景：在网页中展示特殊符号效果时，需要使用字符实体替代
结构：&英文;
常见字符实体：

显示结果	描述	实体名称
	空格	` `
<	小于	`<`
>	大于	`>`
&	和	`&`
"	引号	`"`
'	单引号	`'`(IE不支持)
¢	分	`¢`
£	磅	`£`
¥	元	`¥`
€	欧元	`€`
§	小节	`§`
©	版权	`©`

属性名	属性值	说明
rowspan	合并单元格的个数	跨行合并，将多行的单元格垂直合并
colspan	合并单元格的个数	跨列合并，将多列的单元格水平合并

显示结果	描述	实体名称
	空格	` `
<	小于	`<`
>	大于	`>`
&	和	`&`
"	引号	`"`
'	单引号	`'`(IE不支持)
¢	分	`¢`
£	磅	`£`
¥	元	`¥`
€	欧元	`€`
§	小节	`§`
©	版权	`©`

显示结果	描述	实体名称
	空格	` `
<	小于	`<`
>	大于	`>`
&	和	`&`
"	引号	`"`
'	单引号	`'`(IE不支持)
¢	分	`¢`
£	磅	`£`
¥	元	`¥`
€	欧元	`€`
§	小节	`§`
©	版权	`©`

显示结果	描述	实体名称
	空格	` `
<	小于	`<`
>	大于	`>`
&	和	`&`
"	引号	`"`
'	单引号	`'`(IE不支持)
¢	分	`¢`
£	磅	`£`
¥	元	`¥`
€	欧元	`€`
§	小节	`§`
©	版权	`©`