如何在html中的span标签中设置宽度[重复]答案

【问题标题】：How to set a width in span tag in html [duplicate]如何在html中的span标签中设置宽度[重复]
【发布时间】：2015-08-06 18:52:11
【问题描述】：

我在不同宽度的基础上显示具有不同颜色的垂直条，但即使我改变宽度，它也会显示固定宽度

<span style="position:relative;border-left:solid;left:0px;top:0px;width:550px;height:18px;clip:rect(0,550px,18px,0);background-color:#f0f0f0;overflow:hidden; border:1px solid #000000;"></span> 
<span style="position:relative;border-left:solid;left:0px;top:0px;width:350px;height:18px;clip:rect(auto,auto,auto,auto);background-color:#FFFFFF;overflow:hidden; border:1px solid #000000;"> </span>

【问题讨论】：

标签： css html

【解决方案1】：

你可以参考下面的例子

<ul>
<li><span>&nbsp;</span> The lazy dog.</li>
<li><span>AND</span> The lazy cat.</li>
<li><span>OR</span> The active goldfish.</li>
</ul>

ul 
{
list-style-type: none;
padding-left: 0px;
}

ul li span { 
float: left;
width: 40px;
}

http://jsfiddle.net/laurensrietveld/JZ2Lg/

或者使用display: block;，然后给出宽度

【讨论】：