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

从 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 这些伪类的样式。

欢迎补充。