css使用float怎么居中？

css并没有float:center，但是实现水平居中浮动是可以实现的。

以下面的Li列表为例，我们要实现中间LI的居中浮动：

<div id="macji">
    <ul class="macji-skin">
        <li>列表一</li>
        <li>列表二</li>
        <li>列表三</li>
    </ul>
</div>

我们需要先了解下position:relative属性，它是指left、right、top、bottom等中的偏移位置。

（相关课程推荐：css视频教程）

1、我们可以让ul为position:relative;left:50%，

2、再让li向左浮动

3、最后设置li position:relative;right:50%（或者left:-50%），那么li就会向中间浮动一样居中了

#macji{
    position:relative;
    width:100%;
    background-color:#eee;
    text-align:center;
    overflow:hidden;
}
#macji .macji-skin{
    float:left;
    position:relative;
    left:50%;
}
#macji .macji-skin li{
    position:relative;
    right:50%;
    float:left;
    margin:10px;
    padding:0 10px;
    border:solid 1px #000;
    line-height:60px;
}

效果：