本文已参与「新人创作礼」活动，一起开启掘金创作之路。
目录
一、前言
上一篇文章我整理以前的知识是：1、h1到h6 标题标签 2、p 段落标签 3、br 换行标签【单标记】，详细可参考博文 [web快速入门之基础篇-html：2、html基本标签之标题标签、段落标签、换行标签]，这篇文章我将整理：html基本标签之之分组标签（div、span）、特殊字符
二、实例举例
实例代码
我们先来看看一个例子，如下代码：02_分组span和div、特殊字符.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>这是title标题</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
</head>
<body>
<!--1、普通文本和特殊字符串 -->
<如果这都不算爱空格折叠： ,我有什么好悲哀>
<如果这都不算爱特殊字符：     ,我有什么好悲哀>
<!--2、分组标签：div 和 span -->
<p>文字<div style="color:#00FF00">测试div(不会跟文字在同一行)</div></p>
<p>文字<span style = "color:red;">测试span(会跟文字在同一行)</span></p>
</body>
</html>
运行效果
用谷歌浏览器打开运行，效果如下：
编辑
三、要点说明
1、普通文本和特殊字符
（1）空格折叠：多个空格以及换行，它会折叠显示为1个
（2）特殊字符: 转义字符
< <
> >
空格
2、分组
(1) div 标签
标签可以把文档分割为独立的、不同的部分
注释：
是一个块级元素，也就是说，浏览器通常会在 div 元素前后放置一个换行符
提示：请使用
元素来组合块级元素，这样就可以使用样式对它们进行格式化。
如果用 id 或 class 来标记
，那么该标签的作用会变得更加有效。
class 用于元素组（类似的元素，或者可以理解为某一类元素），
而 id 用于标识单独的唯一的元素。
详细可参见：
www.w3school.com.cn/tags/tag_di…
(2) span 标签
标签被用来组合文档中的行内元素。
提示：请使用 来组合行内元素，以便通过样式来格式化它们。
注释：span 没有固定的格式表现。当对它应用样式时，它才会产生视觉上的变化。
(3) div 和 span 的差别
2个都是用来划分区间但是没有实际语义的标签。
div是块级元素，不会其他元素在同一行;
span是行内元素，可以与其他元素位于同一行
(4) 块级元素分组 和 行内元素分组
:适用于对于块级元素分组:适用于对于行内元素分组
**块级元素(block):独占一行,h1,p,div，table，ul，ol，li
**行内元素(inline):可以和其他元素位于同一行,span,a
