我们在用CSS制作页面时，有时会感觉到对于div与span标签在某些情况下是没有区别的。div 和 span 元素最大的特点是默认都没有对元素内的对象进行任何格式化渲染。主要用于应用样式表。div与span两者最显著的区别在于div是块元素可以包含段落、标题、表格，乃至诸如章节、摘要和备注等。而span是行内（即内嵌）元素，span 的前后是不会换行的，它没有结构的意义，纯粹是应用样式，当其他行内元素都不合适时，可以使用span。如果不对div元素定义任何CSS属性，其显示效果等于在前后各加一个<br>换行。
所谓块元素，是以另起一行开始渲染的元素，行内元素则不需另起一行。下面给出一行代码，方便大家能更形象的理解div与span的区别。 代码如下：
测试<span>紧跟前面的"测试"显示</span><div>从这里开始会另起一行显示</div>
块元素和行内元素也不是一成不变的，只要给块元素定义display:inline，块元素就成内嵌元素，同样地，给内嵌元素定义了display:block就成块元素了。如以下代码：
测试<div style="display:inline">紧跟前面的"测试"显示</div><span style="display:block">这里会另起一行显示</span>
行内样式定义<span>元素的基本语法：<span 属性=“属性值></span>
<span>元素的首尾标记必须同时成对出现，且<span>元素允许多重嵌套，也就是说，一个<span>元素中可以嵌套任意多个<span>元素。
块级样式定义<div>元素的基本语法：<div 属性=“属性值”></div>
<div>元素的首尾标记必须同时成对出现，且<div>元素允许多重嵌套，也就是说，一个<div>元素中可以嵌套任意多个<div>元素。
div与span相区别的实例：
我们建立三个div，并在每个div里面插入一张图片；建立三个span，也在每个span里面插入一张图片。代码如下：
<p>div标记不同行：</p>
<div><img src="http://www.ittribalwo.com/images/logo.gif"></div>
<div><img src="http://www.ittribalwo.com/images/logo.gif"></div>
<div><img src="http://www.ittribalwo.com/images/logo.gif"></div>
<p>span标记同一行：</p>
<span><img src="http://www.ittribalwo.com/images/logo.gif"></span>
<span><img src="http://www.ittribalwo.com/images/logo.gif"></span>
<span><img src="http://www.ittribalwo.com/images/logo.gif"></span>
从上面的例子我们可以看出，结果就是div排列的图片，是每张占一行。而span排列的图片，三张都在同一行。div默认的是一个行外标记，一个块对象，默认情况下，一个div是占一行,而span是一个行内标记，一个内联的对象，默认情况下，span嵌套在任何页面中，在不超过父模块边界的情况下，是在同一行显示的。
