css - 中心跨度在 4 之间？

Question

我连续有 4 个跨度。

<div id=container>
     <span id="1">blue</span>
     <span id="2">red</span>
     <span id="center">all colors</span>
     <span id="3">grey</span>
</div>

我想在网络浏览器的中央显示“所有颜色”，在其左侧显示蓝色和红色，在右侧显示灰色。

我该怎么做？

Answer 1

<div id="container">
<span class="float_l blue">blue</span>
<span class="float_l red">red</span>
<span>all colors</span>
<span class="float_r gray">grey</span> 
</div>

#container {text-align:center;overflow:hidden;}
#container span {display:block;width:auto;height:20px;line-height:20px;padding:0 10px;}
.float_l {float:left;}
.float_r {float:right;}
.blue {background:blue;}
.red {background:red;}
.gray {background:#ccc;}

如果你想让右边的 float 元素和其他元素在同一行，你必须把它放在左边的 float 元素之前。