给span加属性 display:inline-block
下面是我修改的代码：.idSpan{
display:inline-block
border:1px solid #999999
margin:2px
padding:5px 10px
background-color: #d0f7c1
font:20px/20px "幼圆","楷体","宋体",Arial,sans-serif
text-align:center
cursor:pointer
}
//解释一下为什么需要加display:inline-block；因为在css中分块级元素和行内元素，块级元素都是从新行开始的，margin和padding四个方向都起作用，如div，而span是行内元素，总在一行内，因此只有margin-left和margin-right有效，宽高和margin-top,margin-bottom,padding都无效。还有一类是行内块元素，顾名思义就是在不换行但拥有块元素其他的性质。改变其属性的方式是display,
display:block就是块,display:inline就是行,display:inline-block就是行内块，你可以通过这个把div变为行内，把span变成块级等等，你想咋样就咋样
span标记定义HTML文档中的一个行内间隔，SPAN 的前后不换行的，它没有结构的意义，纯粹是应用样式，当其他行内元素都不合适时，可以使用SPAN。可以简化的理解为用span就是为了给一些元素以特殊样式，或者当空标签挂图用。举例来说<p style=" color:#000" >我是黑色的字<span style=" color:#f00" >我是红色的字</span>我是黑色的字</p>我们给了<p>标签内文本“color:#000”的样式，也就是说令文字颜色为黑色，而文章中有几个字你希望用红色标出，那么就用到了span,span标签内的元素可以单独给另一个样式。或者比如没有地方挂图片的时候：<a>新品推荐</a><span style="background:url(..image/hot.gif)"></span>这是一个链接，假设我们这个链接就是有渐变背景图的，已经挂在了a标签上，但是常见的“其他新品推荐”不是会带一个闪动的"HOT!"小图标嘛，我们没有标签可以挂背景了。这时只需要外加一组span，就可以单独给一个带背景图片的样式。你可能会想为什么不能用个空的div挂图，第一div是块状元素而a是内联元素，第二用空div相当于让系统多读取了一个无意义的div，是要减缓网页读取速度的，span没这个问题left是指对象的左上角的x坐标margin-left，要搞明白这个问题，你先要看一下css盒模型
内容到边框的距离叫padding,叫内边距
如果一个div名叫a；左边有一个div叫b，margin为o；那么
a的margin－left是表现为a左边框到这个b的边框的距离
