CSS有float:left和float:right，但能否实现float:center呢?水平居中浮动，当然是可以的，这里将介绍你实现方法。以下面的Li列表为例，我们要实现中间LI的居中浮动：
1
2
3列表一
4列表二
5列表三
6
7
我们需要先了解下position:relative属性，它是指left、right、top、bottom等中的偏移位置。我们可以让ul为position:relative;left:50%，再让li向左浮动，再让position:relative;right:50%（或者left:-50%），那么li就会向中间浮动一样居中了。不相信的可把下面的CSS定义结合上边的代码拷贝到HTML测试。
view source
01#macji{
02position:relative;
03width:100%;
04height:80px;
05background-color:#eee;
06text-align:center;
07overflow:hidden;
08} 备碧改
09#macji .macji-skin{
10float:left;
11position:relative;
12left:50%;
13}
14#macji .macji-skin li{
15position:relative;
16right:50%;
17float:left;
18margin:10px;
19padding:0 10px;
20border:solid 1px #000;
21line-height:60px;
22}
虽然这样用有些麻烦，但仿判对于一个优秀的前端设计慧哪师，这个技巧还是有必要掌握的哦。
以上就是土嘎嘎小编大虾米为大家整理的cssfloat居中_web中float居中相关主题介绍,如果您觉得小编更新的文章对您有所帮助，不要忘记讲本站分享给您身边的朋友哦！！