如何给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

相关推荐