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

html-css013

CSS中如何把Span标签设置为固定宽度,第1张

一、形如ABCDEF格式行设置SPAN为固定宽度的方法如下：span {width:60pxtext-align:centerdisplay:blockfloat:left}实际验证结果：IE6 OK， FIREFOX 3 OK。二、形如ABCDEFGH格式行设置SPAN为固定宽度的方法如下：span {width:60pxtext-align:centerdisplay:inline-block}实际验证结果：IE6 OK， FIREFOX 3 OK。提示： 完美兼容就是把display属性设为inline-block，同时也可兼容前两种情况。 block，inline，inline-block的区别：display:block——类似与DIV标签的宽高边距等属性均可定制的元素特性；display:inline——类似与、标签的宽高等属性不可定制的元素特性；display:inline-block——“全”可定制属性的元素特性； 补充：1、如何让AAABBB里头的BBB靠右对齐且不换行？答：如果对span使用float属性，总是导致span换到下一行。可以采用下面方法实现同行且居右对齐。

span是行内元素，不可能有高度和宽度的，你肯定在span标签里添加内容了，撑出来的宽高！想要有宽高必须转话成块级元素！

你的错误，没写 "r_left" 的css,还有没写displayblock 这样span没有宽度限制，内容超出了li标签宽度也能出错

span元素为内联元素，不具备宽度特性，设置text-align属性会没有效果，因此需要将span元素的展示类型转化为具有块级特性。

方法1：设置span的display属性为block。

<span style="font-size:14pxtext-align:centerdisplay:block">...</span>

方法2：设置span的display属性为inline-block，这种方式需要手动设置span的宽度。

<span style="font-size:14pxtext-align:centerdisplay:inline-blockwidth:500px">...</span>

扩展资料

html标签中根据元素的展示形式，主要分为块元素和内联元素。

块元素特点：

1、总是在新行上开始。

2、高度、行高以及外边距和内边距都可控制。

3、宽度缺省是它的容器的100%，除非设定一个宽度。

4、它可以容纳内联元素和其他块元素。

内联元素特点：

1、和其他元素都在一行上。

2、高度、外边距和内边距不可改变。

3、宽度就是它的文字或图片的宽度，不可改变。

4、内联元素只能容纳文本或者其他内联元素。

参考资料：

百度百科-块元素

百度百科-内联元素