一个基础性问题但搞不明白，span标签到底是怎么用的

Question

span标签和a标签有什么区别？哪些情况下用span，我写了4年的html代码没有用span标签为什么还是能做出网页来

Answer 1

从 2 个角度讲 a 和 span 的区别：
1.语义&用途：
（1）<a> 标签的本义是锚点，通常用来表示链接，链接到
（1.1）互联网上任意一个可以被访问的位置（网页、供下载的文件等）
（1.2） 也可能是当前网页中的某个位置
（1.3） 另外还可以用来执行 JavaScript
可以看出来<a>标签的存在和各种 行为 密不可分，因此它最广泛的用途就是做链接和按钮。
（2） <span>标签本身没有特别的语义，通常用来给文本中的片段添加样式或属性
举个例子，非最佳实践：<p>光的三原色是<span class="red" style="color:red;">红</span>、<span class="green">绿</span>、<span class="blue" style="color:blue;">蓝</span>。</p>
2.事件响应：
（1）<a>能够响应键盘的 Tab 和 Enter 按键，可以设置 tabindex 属性
（1.1）按 Tab 你可以把焦点移动到这个链接或按钮上，同时触发 onfocus 事件
（1.2）按 Enter 相当于鼠标点击，触发 onclick 事件，页面该跳转的跳转，表单该提交的提交
可以看出来，这也是<a>标签通常被用来做链接、按钮的重要原因
（2）以上两个键盘事件，<span>默认都不支持。在一些比较“聪明”、“宽容”的浏览器里面，<span>标签也可以设置 tabindex 属性，设置之后也可以响应 Tab 按键，但是不会响应 Enter 事件。演示。所以，尽管用<span>完全可以做出和<a>一样的视觉效果，但是用<span>做按钮绝对不是最佳选择。

a 和 span 的共同点主要在样式上：都不是块级元素，都可以设置 :hover, :active, :focus 这些伪类的样式。

欢迎补充。

Answer 2

1). 他们都是“行内元素”（inline），即相对于div等的“块元素”，他们是可以平静地存在于一段文字内部的，不需要换行。div默认在上下都是会换行的，把自己独立成一个矩形块。

2). a一般用于超链接元素，即要有href属性，例如

href="http://lvwenhan.com"
href="mailto:[e-mail]"

3). span是常用的行内元素容器，一般可用于定义一行内的几个字有特殊的颜色、大小、字体等。

Answer 3

最明显的区别：<div> <h2> <p> 会换行，并且<h2> <p>会有边距，行高等属性，而<span>没有换行也没有边距也没有样式，同样用来添加一段不需要额外属性，样式的对象，文字啊 图片啊 链接啊之类的

<div>一段文字，<span class="color_red">颜色</span>不同</div>

至于<a>，很明显是用来链接(一切的基础)，所以才会是<a>不是<l> (link)

Answer 4

我自己的理解是 div是块级元素 无语义 只需要一个盒子的时候用的 span是行内需要盒子的时候用的

a 标签 href 链接 还有一些兼容有特别的处理

Answer 5

"span"标签主要用来存放文字

跟它相对应的是"p"标签，而不是"a"

http://www.w3schools.com/tags/tag_span.asp