如何给span设置宽度(width)？

在网页中，如何给 span 元素设置宽度？很简单嘛，假定宽度为 100 像素，用 css 设置 width:100px。如果你认为这个答案正确，就请继续往下看；否则，你可能已经知道了答案。

 

现在，你可以尝试一下，你会发现这个宽度设置根本就不起作用。为什么呢？因为 width 只对块状元素起作用，而 span 默认为行内元素。如何让 width 设置有效呢，那就把它变成块状元素，设置 display:block，但是这样一来，span 前后就会增加换行了，可能与我们的预期又不一致了，正确的做法是设置 display:inline-block，这是个行内与块状的混合物。

 

经过测试，在 IE/FF/Opera/Safari 中都可行。

 

参考资料：

【1】如何设置HTML span 的宽度

http://www.blabla.cn/css_kb/html_span_width_kb.html

【2】无法设定span宽度问题的解决方法

http://dreamweaver.abang.com/od/divcss/a/span-display.htm

【3】CSS中如何把Span标签设置为固定宽度

http://www.metsky.com/archives/81.html

【4】firefox里关于CSS里设定span的width无效的原因

http://hi.baidu.com/gantianamin2001/blog/item/2c9bf2de48f14e5ccdbf1a6f.html