div vs span

对于CSS布局而言，除了对id  与class选择符的使用中会存在一定的问题外，就是span.

span与div从语义上无法理解其真正用途，而在使用上span及div几乎所有相同的属性.

如下代码所示

<div id="d1">div1</div> <div id="d2">div2</div> <br /> <span id="s1">span1</span> <span id="s2">span2</span>   CSS代码：        #d1,#d2,#s1,#s2{               border:1px solid #000FFF;               padding:10px;              }

显示效果如下

从上面效果可以看到，两个div之间出现了换行，而span是并行。

对于XHTML的每一个对象而言，都拥有自己默认的显示模式，div对象的默认显示模式display:block; 而span是display:inline;

在实际使用中 div对象的任务是呈现一个块状内容，如一大段文本，一个导航区域，一个页脚区域等显示块状的内容进行结构编码并进行样式设计。

而作为内联对象的span,用途是对行内元素进行结构编码 以方便 样式设计。span默认状态下就不会破坏行中元素的显示顺序，例如在一大段文本中，需要改变其中一段文本的颜色，可以使用span并进行样式设计，这将不会改边这一整段文本的显示方式。

div与span对象有着自己各自的用途与使用方法，虽然可以通过display属性的更改对它们的显示方式进行变化。但并不以为着二者的互换能够对页面带来好处，要根据实际场合使用对象来页面设计任务。