span宽度高度成功设置解决篇

有时候span标签加上宽度高度，但它显示的时候设置的宽度，高度样式都没有生效。为了解决这个问题，有两种解决方案

 

第一种情况：对span设置宽度高度后，独占一行（前后将换行）

 

 

 

 

我们要对样式span设置display:block。
在span的css中增加css display属性，将display值设置为block类型（块），即可实现。

 

第二种情况：对span设置宽度高度后，前后内容不换行

 

 对span标签设置宽度和高度效果图：

 

 

这种情况是即能实现span宽度和高度生效，又不让span对象前后内容不换行。

在css2.1标准中为display增加了一个叫inline-block的属性值，刚好可以实现即是inline对象，又可以像block那样设置宽度的属性值，这个属性值在ie6以上版本都有效，firefox要在3.0以后才行，如果要兼容2.0的朋友可以使用-moz-inline-box达到同样的效果。

 

文章来自：源码在线https://www.shengli.me/css/14.html