网站建设技巧：使用float:left并排布局后整体居中

我们在进行网站建设时经常会遇到这样的问题，几个DIV或LI模块元素要求并排一行显示后使其整体居中，如以下布局情况：
<ul>
  <li></li>
  <li></li>
  <li></li>
</ul>
可能很多人会想到以下布局方法：
<ul style="width:100px;text-align:center">
  <li style="float:left;width:10px;"></li>
  <li style="float:left;width:10px;"></li>
  <li style="float:left;width:10px;"></li>
</ul>
但实际效果中，如果LI被定义了float:left后，是无法使并列一行后的LI元素在UL中整体显示居中的，LI会一个个靠左排列。

那么如何才能让使用了float:left并排布局后再整体居中呢？目前或许最好的办法还是使用display:inline替代float:left，如下：
<ul style="width:100px;text-align:center">
  <li style="display:inline;padding:5px;margin:5px;"></li>
  <li style="display:inline;padding:5px;margin:5px;"></li>
  <li style="display:inline;padding:5px;margin:5px;"></li>
</ul>
但这样使用后缺点就是无法定义LI的宽度，只能使用padding跟margin来协调处理显示间距效果。

你有什么更好的办法让使用float:left并排布局后的模块元素整体居中吗？

本文原创：广州网站建设，地址：http://www.studstu.com/news/1048.html，转摘请保留版权信息。

2014/11/19 网站建设后台操作问题总结

2014/11/12 2014天猫双十一销售业绩，无线成交耀眼

2014/11/5 服务器Mcrypt.so加密库支持未安装解决方法

2014/10/29 网站建设在线调用云编辑器

2014/10/27 浅析获取网站访客QQ号码方法原理

2014/10/24 手机网站建设自适应屏幕大小代码

2014/10/20 奇亿网站建设公司2014官网新版上线公告

2014/10/8 如何保留文本框的输入格式

2014/9/26 手机网站微网站微商城PC网站如何区别

2014/9/17 奇亿网站制作国庆放假通知

2014/9/9 百度推出直达号服务试水O2O

2014/9/9 英文网站建设外链效果对比

2014/8/21 奇亿网站建设关于中秋节放假安排

2014/8/18 企业网站建设定位原则

2014/8/11 2014网站SEO优化报告全球版

2014/7/28 网站建设如何进行国际化定位

2014/7/16 谷歌广告联盟AdWords九月新政策

2014/7/9 为产品使用购物广告

2014/7/7 网站建设中不可忽视的网站测试工序

2014/6/30 微电商网站建设的几种类型